为什么不css：在某些情况下不起作用？

Question

为什么disconnectAfterWriting()选择器在这种情况下根本不起作用：

:not

例如：

a {
  color:red;
}

div a:not(.special a) {
  color: green;
}

演示：https://jsfiddle.net/eguecrvz/

Answer 1

special是div而非anchor的等级。

更改css，如：

div:not(.special) a{
  color: green;
}

<强> Fiddle

修改

如果您想要除.special以外的所有链接绿色，请执行以下操作：

a {
  color:green;
}

.special a{
   color: red;
}

<强> Updated Fiddle

Answer 2

:not()目前不允许组​​合器或任何多个简单选择器（例如.special或a）作为参数。未来的规范将展开:not()以接受任意数量的复杂选择器，一旦浏览器支持它，您的选择器div a:not(.special a)将完全按预期工作。

与此同时，无法为＆＃34; a元素编写一个没有.special祖先元素的选择器。＆＃34;您需要override并在规则中添加一个.special a选择器，以适用于a元素：

a, .special a {
  color:red;
}

div a {
  color: green;
}

.special a的额外特异性将确保它覆盖div a，但如果特异性存在问题，则需要重新排列规则集。

Answer 3

  

为什么css :not在某些情况下不起作用？

div a:not(.special a) {
   color: green
}

因为否定伪类（:not）仅将简单选择器作为参数。

您的论据(.special a)代表后代选择器，但不符合条件。

  

6.6.7. The negation pseudo-class

     

否定伪类:not(X)是一个功能符号   一个简单的选择器（不包括否定伪类本身）作为   论点。它表示一个未由其表示的元素   参数。

什么是简单的选择器？

  

4. Selector syntax

     

一个简单的选择器是类型选择器，通用选择器，   属性选择器，类选择器， ID选择器或伪类。