如何在CSS中设置单击按钮的样式 [英] How to style a clicked button in 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>

这篇关于如何在CSS中设置单击按钮的样式的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！