小编典典

:not()否定接受子代选择器

css

我一直在使用:not()伪类来设置样式,而无需使用第二个不必要的声明来覆盖它来撤消第一个声明,但是现在我遇到了一个奇怪的行为,其中Safari接受了内的后代选择器:not(),但Chrome却没有。

我用过类似的东西a:not(.blue a)

我搜索了答案,但我仍然不完全了解原因。
规范确实允许后代选择器吗?

这是一个演示:

a:not(.blue a) {
  color: red;
}



<div><a>this one should be in red</a></div>
<div class="blue"><a>this one shouldn't</a></div>

阅读 330

收藏
2020-05-16

共1个答案

小编典典

选择器级别3中,答案为否。该:not()表示法仅接受
简单的选择器

6.6.7。 否定伪类

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

什么是简单选择器?

从选择器语法:

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

与后代选择器无关。

但是 ,在选择器级别4中,:not()接受
复杂的选择器 ,其中将包括后代组合器。浏览器对该规范的支持仍然很薄弱。

2020-05-16