[分享]css3怎按钮变颜色

CSS3是网页设计中常用的样式语言之一，也是一种可以实现按钮变颜色的技术。以下是关于CSS3如何实现按钮变颜色的代码示例:button{ backgroundcolor: green; color: ...

CSS3是网页设计中常用的样式语言之一，也是一种可以实现按钮变颜色的技术。以下是关于CSS3如何实现按钮变颜色的代码示例:

button{
  background-color: green;
  color: white;
  border: none;
  padding: 10px 20px;
  border-radius: 5px;
}

button:hover{
  background-color: blue;
} 

在上面的代码中，我们使用了button选择器来选择网页中的按钮元素。使用background-color属性设置按钮的背景颜色，并使用color属性设置按钮的文本颜色，在这里，我们将背景颜色设置为green，将文本颜色设置为white。

此外，我们还使用了border属性设置按钮边框的样式，这里选择了none，意味着没有边框；并使用padding属性设置按钮内部的填充，这里我们将填充的上下为10px，左右为20px。

最后，我们使用了border-radius属性设置按钮的圆角，这里将按钮的圆角设置为5px。

接下来，我们使用了:hover伪类来设定按钮在鼠标悬浮时的样式。这里我们将背景颜色设置为blue，当鼠标悬浮在按钮上时，背景颜色就会从green变成blue，从而实现按钮的变颜色效果。

以上就是关于CSS3如何实现按钮变颜色的简单介绍，希望对大家有所帮助！