Question

我在按钮上使用了:focus和:active，但是在区分两个按钮时遇到了问题。在:focus上，我希望文本具有特定的bgcolor，并在文本上加下划线；在:active上，我只希望bgcolor变为与为：focus定义的颜色不同的颜色，并且不带下划线。 html：

<button>
  When focused, my bgcolor turns red!<br />
  But  when clicked, where my bgcolor  turns #b0bfc6
</button>

CSS：

 button { font-weight: normal; color: black; }
  button:focus { 
  background-color: red; 
  text-decoration: underline;
  }
  button:active{
    background-color: #b0bfc6;
    }

这是小提琴： https://jsfiddle.net/ph16qjx2/

无论如何，问题是，当我按下键（在:active中）时，它也会同时使用为:focus定义的属性（我不想为：active加上下划线，但是仍然显示下划线为:active）我也看到单击按钮后，它会将bg颜色更改为:active的所需颜色，但后来它更改为为:focus定义的bgcolor 任何想法如何解决这个问题？

如何防止将：focus属性应用于：active属性-CSS

0 个答案: