如果使用CSS悬停，如何让我的禁用按钮不会改变颜色？

Question

我试过这个CSS：

html.dark .btn:hover:not(disabled),
html.dark .btn:focus {
  color: #ffffff;
  background-color: #222222;
  *background-color: #151515;
}
html.dark .btn.disabled,
html.dark .btn[disabled] {
  color: red;
  background-color: #222222;
  *background-color: #151515;
}

但是当我将鼠标悬停在按钮上时，我看到颜色从红色变为白色。请注意，它正确地了解了它被禁用的事实。我正在使用：

disabled="disabled"

在我的按钮中。

Answer 1

尝试.btn:hover:not(:disabled),

一个小例子

你的例子没有用，因为你使用.btn:hover:not(disabled)你必须使用伪类来实现你需要的reference pseudo classes

＆＃13;

＆＃13;

button:hover:not(:disabled){
    color:red;
}

＆＃13;

<button>Not disabled</button>
<button disabled>disabled</button>

＆＃13;

＆＃13;

＆＃13;