如何在CSS中设置单击按钮的样式

如何在CSS中设置单击按钮的样式

问题描述:

我查看了W3学校网站 W3Schools ,该网站介绍了CSS样式按钮.单击时,我需要指定一个按钮样式.伪类选择器是什么?例如悬停按钮是:

I looked at W3 schools website W3Schools which explained styling buttons with CSS. I need to specify a button style when it is clicked. What is the pseudo-class selector for this? e.g. the hover button is:

.button:hover{ 
}

此按钮最初将显示为黄色.悬停时它将变为橙色.当您单击它时,它将变为红色.我使用:hover和:focus来调整样式.(:active选择器通常用于链接(即< a> 标记)))

This button will appear yellow initially. On hover it will turn orange. When you click it, it will turn red. I used :hover and :focus to adapt the style. (The :active selector is usually used of links (i.e. <a> tags))

button{
  background-color:yellow;
}

button:hover{background-color:orange;}

button:focus{background-color:red;}

a {
  color: orange;
}

a.button{
  color:green;
  text-decoration: none;
}

a:visited {
  color: purple;
}

a:active {
  color: blue;
}

<button>
Hover and Click!
</button>
<br><br>

<a href="#">Hello</a><br><br>
<a class="button" href="#">Bye</a>