CSS伪类输入：不（禁用）不：[类型=“提交”]：焦点

138

我想对输入元素应用一些CSS，而我只想对未禁用并且没有提交类型的输入进行处理，在CSS下面是行不通的，也许有人可以向我解释如何添加它。

input:not(disabled)not:[type="submit"]:focus{
box-shadow:0 0 2px 0 #0066FF;
-webkit-box-shadow:0 0 4px 0 #66A3FF;
}

css css-selectors pseudo-class

— BurebistaRuler
source

284

代替：

input:not(disabled)not:[type="submit"]:focus {}

用：

input:not([disabled]):not([type="submit"]):focus {}

disabled是一个属性，因此需要使用方括号，而且您似乎在:not()选择器上混用/缺少了冒号和括号。

需要注意的一件事：我可能错了，但是我认为disabled输入通常不会获得焦点，因此这部分可能是多余的。

或者，使用 :enabled

input:enabled:not([type="submit"]):focus { /* styles here */ }

同样，我无法想到禁用输入可以获得焦点的情况，因此似乎没有必要。

— 韦斯利·默奇（Wesley Murch）
source

41

：不使用（禁用）是一个非常详细的书写方式：启用developer.mozilla.org/en-US/docs/Web/CSS/:enabled

— 亚德里亚

@Adria不适用于<a>。有一个<a disable='disabled'>的人，必须专门使用：disabled选择器。FF65。

— 罗伯特·尼斯特罗伊

由于某种原因，“：enabled”对我而言

— 不在

使用:not([disabled])VS 之间有什么区别。:not(:disabled)？

— bubencode

15

您的语法非常严格。

更改此：

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

至：

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

似乎很多人不知道:enabled，并:disabled有有效的CSS选择器...

— 加文
source

5

为什么不将其进一步缩短input:enabled:not([type="submit"]):focus{？

— 肖恩·比恩

7

您可以选择几种错别字。它应该是：input:not([disabled]):not([type="submit"]):focus

有关概念证明，请参见此jsFiddle。在旁注中，如果删除了“ background-color”属性，则框阴影不再起作用。不知道为什么。

— 帕特里克·阿克斯特兰德
source