CSS按钮点击后颜色 |css js 加载时间过长

.btn{
color:#fff;//文字颜色
background-color:#00f;//默认背景色
}
.btn:active{
color:#000;//点击后文字颜色
background-color:#f00;//点击后背景色
}

以上是一个简单的CSS按钮点击后颜色切换的实现方法。大家首先定义按钮的默认样式，包括文字颜色和背景色。接下来使用伪类:active来定义按钮被点击后的样式。在这个样式里，大家可以改变按钮的文字颜色和背景色来实现颜色的切换效果。

除了使用:active伪类，大家也可以使用:hover来实现按钮在鼠标经过时的颜色变化。这两种方法都是使用CSS伪类来定义特定状态下的样式，非常方便。

总的来说，CSS按钮点击后颜色的实现很简单，只需要使用伪类来定义即可。这个功能可以让大家的界面更加动态，让用户能够直观地感受到他们的操作。在设计UI时，大家可以多加运用这个特性来实现更丰富的交互效果。