多个属性的CSS规则

Question

我想为type submit的输入按钮设置一些CSS规则，该按钮没有disabled设置为true，而且{{1}选择器已启用。

以下语法对我不起作用：

hover

解决方案是什么？

Answer 1

尽管~=，

~并不意味着“不等于”。这意味着something different entirely（但具体意味着它超出了本问题的范围）。

HTML中的disabled属性是布尔属性，这意味着它没有特定的值本身（除非你在谈论XHTML，但这是另一回事完全）。你可能正在寻找一个根本没有属性的输入，而不是它的值不是true。在这种情况下，您将使用：

input[type="submit"]:hover:not([disabled])

更好的是，如果您能够负担浏览器兼容性use the :disabled pseudo-class instead of an attribute selector，那么您不必担心可能的属性值：

input[type="submit"]:hover:not(:disabled)

（请注意，我还删除了选择器末尾的无关:hover，我认为这是一个错误。）

Answer 2

您可以使用

input[type="submit"]:enabled:hover {
  background: red;
}

请注意，IE＆lt; 9不支持enabled选择器。

有关示例，请参阅此JSFiddle。