这让我抓狂:
HTML:个
<div><h1>Hello World!</h1></div>
CSS:个
*:not(div) h1 { color: #900; }
这不是说，" Select 所有h1个元素，它们的祖先不是div个元素……"于是，"你好，世界！"不应该是红色的，但它仍然是红色的.
对于上述标记，添加子combinator是有效的:
*:not(div) > h1 { color: #900; }
但如果h1元素不是div元素的子元素，则不影响它.例如:
<div><article><h1>Hello World!</h1></article></div>
这就是为什么我想指出h1元素是div元素的后代，而不是子元素.有人吗？
这不是说，" Select 祖先不是
div个元素的所有h1个元素.？"
确实如此.但是在一个典型的HTML文档中，everyh1至少有两个祖先不是div元素-而这些祖先正是body和html.
这就是try 过滤祖先使用:not()的问题:它不能可靠地工作，特别是当:not()没有被其他 Select 器(如类型 Select 器或类 Select 器，如.foo:not(div))限定时.只需将样式应用到所有h1个元素并用div h1覆盖它们，您就会轻松得多.
在Selectors 4年，:not()已经得到了增强，可以接受包含组合子的完整复杂 Select 器，包括后代组合子.这是否会在fast概要文件(以及CSS)中实现还有待测试和确认，但一旦实现，您就可以使用它来排除具有特定祖先的元素.由于 Select 器的工作方式，为了可靠地工作，必须对元素本身而不是祖先进行否定，因此语法看起来会有些不同:
h1:not(div h1) { color: #900; }
任何熟悉jQuery的人都会很快指出这一点.这是 Select 器4试图纠正的a number of disparities between Selector 3's :not() and jQuery's :not()个问题之一.