当 CSS 悬停时，如何使禁用的按钮不改变颜色？答案

【问题标题】：How can I make my disabled button not change color when there's a hover with CSS?当 CSS 悬停时，如何使禁用的按钮不改变颜色？
【发布时间】：2015-06-20 15:05:31
【问题描述】：

我试过这个 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"

在我的按钮中。

【问题讨论】：

请发布足够多的 HTML 以准确重现您的问题；理想情况下，创建一个 sn-p 以提供（最少的）现场演示（edit 你的问题，然后在编辑器中点击<> 按钮）。

标签： html css

【解决方案1】：

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

一个小例子

您的示例不起作用，因为您使用的是.btn:hover:not(disabled)，您必须使用伪类来实现您所需要的reference pseudo classes

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

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

【讨论】：

该死，打败我了：D
不值得单独回答，但也许值得指出disabled 是一个属性，所以:not([disabled]) 将（或应该）也有效。但是，要让这成为一个完整的答案，您确实应该解释为什么发布的代码不适用于 OP。我知道你知道，因为你回答了，但除了“这样做”之外，OP 并没有真正从你的回答中学到任何东西（还）。
@DavidThomas 将其发布为您的答案，我对此一无所知
真的不值得单独回答，为什么最初发布的代码不起作用的解释也将涵盖替代方案。 :)
@Akshay - 这是一个很好的答案，但它不会重复我的代码。你能看看我的代码，它是一个带有 btn 类和 disabled="disabled" 的按钮我试图编辑你的代码 sn-p 但不能。是否有其他方式可以链接到示例。非常感谢。