css控制按钮背景颜色 |ratchet css

.btn {
background-color: #007bff;
color: #fff;
}
.btn:hover {
background-color: #0069d9;
color: #fff;
}
.btn:active {
background-color: #005cbf;
color: #fff;
}

首先，大家定义了一个类名为”.btn”的样式，并设置了背景颜色为蓝色，文字颜色为白色。这是按钮正常状态下的样式。

接下来，大家使用伪类选择器:hover来定义鼠标悬浮在按钮上时的样式。在这里，大家将背景颜色设置为深蓝色。

最后，大家使用伪类选择器:active来定义用户按下按钮时的样式。在这里，大家将背景颜色设置为更深的蓝色。

总之，通过这些CSS样式，大家可以轻松地控制按钮的背景颜色，从而使网站看起来更加吸引人。