css - CSS中的多个冒号

Question

我在 CSS 中看到一行代码如下所示：

[icon]:not([focused]):not([pressed]):not([disabled]){ background-position-y:-0px;  }

在这种情况下，多个冒号是什么意思？它们仍然是伪选择器吗？

Answer 1

它不是伪选择器——它是伪类的选择器。引用W3C Selectors Level 3 文档：

6.6.7. 否定伪类 否定伪类:not(X)是一个以简单选择器（不包括否定伪类本身）作为参数的函数表示法。它表示其参数未表示的元素。[...]

以下选择器匹配 HTML 文档中未禁用的所有按钮元素。

button:not([DISABLED])

下面的选择器组代表除了链接之外的所有 HTML 元素。

html|*:not(:link):not(:visited)

最后一个示例（以及此答案）表明:not，如果您想要为某些不是上述几种类型中的任何一种的元素设置规则，则使用多个伪类选择器链是非常有效的。

在您的情况下，选择器会捕获所有具有icon属性集（任何值）的元素 - 除了那些具有focused,pressed或disabledset （同样，任何值）的元素。