CSS按钮是Web开发中经常使用的元素之一，其可用于触发特定的操作或进入特定的页面。这里我们将讨论如何使用CSS使按钮在被点击后进行颜色变换。

.btn{background-color: #0070f3;color: #fff;border: none;padding: 10px 20px;border-radius: 5px;cursor: pointer;}.btn:focus,.btn:active{background-color: #0055e0;}

首先，我们定义了一个基本的按钮样式，包括背景颜色、文本颜色、边框、内边距、边框半径和鼠标指针样式。

然后使用CSS焦点伪类（:focus）和活动伪类（:active）对按钮进行颜色变换。当按钮被点击或获取当前焦点时，其背景颜色会变为 #0055e0（类似于一个深蓝色），以提示用户当前操作状态。

注意：我们使用了:hover样式表示当鼠标悬停在按钮上时，其颜色并不发生变化。这是因为在移动设备上，悬停效果并不适用。因此，我们需要使用:focus和:active样式来实现颜色变换。

以上便是CSS按钮点击变换颜色的简介。通过简单的CSS代码调整，我们可以让按钮在不同状态下呈现出不同的样式，以增强用户的交互体验。