Question

我在:focus和:active psedo类的样式按钮上遇到麻烦。我为:focus定义了一些我不想申请的属性：active。

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/

如您在小提琴中看到的那样，当我单击它时，该按钮将变为灰色bg，而且还会使用为:focus（即text-decoration: underline; background-color: red）定义的属性如何防止为:focus定义的属性应用于:active

Answer 1

如果我理解正确，您正在寻找的是这样的东西。

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

防止为：focus定义的属性应用于：active- CSS

1 个答案: