css中的多个冒号

Question

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

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

在这种情况下多个冒号的含义是什么？它们仍然是伪选择器吗？

Answer 1

它不是伪选择器 - 它是伪类的选择器。引用W3C Selectors Level 3 doc：

  

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

     

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

     

button:not([DISABLED])

     

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

     

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

最后一个示例（以及this answer）表明，使用多个:not伪类选择器的链是非常有效的，如果你想要的是设置一个规则某些元素不是几个提到的类型。

在您的情况下，选择器捕获具有icon属性集（到任何值）的所有元素 - 除了设置focused，pressed或disabled的元素外（再次，任何价值）。