http://www.w3.org/TR/css3-selectors/#negation
和建议的CSS Selectors Level 4增强功能：
http://dev.w3.org/csswg/selectors4/#negation
我一直在搜索实现和浏览器支持：not(),但我发现的唯一例子是单个元素或元素的直接子元素,例如：
div *:not(p) { color: red; }
< p>时,上述示例有效.是< div>的直接子项,但是当< p>时它不起作用是< div>的更远的后代.
div :not(p) {
color: red;
}
<div>
<ul>
<li>This is red</li>
</ul>
<p>This is NOT</p>
<blockquote><p>This is red but is not supposed to be!</p></blockquote>
</div>
如果答案在上面的官方文档中,那么我没有找到/理解它.正如我所说的,我搜索了这个网站和网站,但找不到任何关于支持或缺乏的讨论：not()作为另一个元素的孙子.
这应该像我认为的那样工作吗？
解决方法
Is this supposed to work like I think it should?
不,你看到的行为是正确的.
在您的上一个示例中,尽管< blockquote>包含< p> ;,它是< blockquote>本身匹配*：not(p),以及它必须是< div>的后代的条件,它是.该样式仅应用于< blockquote>,然后由< p>继承.在里面.
< p>元素本身仍然反对否定,因此< p>本身仍然被排除在你的选择器之外.它只是从其父级继承文本颜色,< blockquote>元件.
即使它的相对接近的祖先没有与选择器相匹配,你也可以担心像html和body这样的元素 – 虽然你可能只是在开始时使用一个身体选择器：
body div...
这就是为什么我经常强烈建议不要使用：not()选择器来过滤后代,特别是当没有使用类型选择器限定时(比如示例中的div).它不像大多数人所期望的那样工作,并且使用像颜色这样的继承属性只会使问题更加复杂,而且会使作者更加困惑.有关更多示例,请参阅我对这些其他问题的回答：
> Why doesn’t this CSS :not() declaration filter down?
> CSS negation pseudo-class :not() for parent/ancestor elements
所描述的问题的解决方案是简单地将不同的颜色应用于< p>.元素.由于继承,您将无法使用选择器简单地排除它们：
/* Apply to div and let all its descendants inherit */
div {
color: red;
}
/* Remove it from div p */
div p {
color: black;
}
选择器级别4：是,：not()确实已被增强,以接受包含组合器的完整复杂选择器.从本质上讲,这意味着(一旦浏览器开始实现它),您将能够编写以下选择器并使其完全符合您的要求：
p:not(div p) {
color: red;
}
如果有人有兴趣,这今天在jQuery中工作.
