css中点击的时候改变颜色

在CSS中，我们可以使用:hover伪类来对鼠标悬停进行样式改变。但是，有些情况下，我们需要点击后才进行样式的改变。这时候，我们可以使用:active伪类。

.button:active {
  background-color: red;
} 

上面的代码表示，在鼠标点击按下的时候，.button这个元素的背景颜色会变成红色。

另外，我们还可以使用:focus伪类来对焦点元素进行样式改变。比如：

input:focus {
  border: 2px solid blue;
} 

这个代码表示，在输入框获取焦点的时候，边框会变成蓝色。

使用:active和:focus伪类，可以让用户在点击和输入的时候，获得更好的反馈，提高用户体验。