問題描述
我一直在使用 :not() 偽類來設置樣式，而無需使用第二個不必要的聲明來撤消第一個聲明來覆蓋它，但現在我遇到了一個奇怪的行為，Safari 接受 :not() 中的后代選擇器，但 Chrome 不接受.
I've been using the :not() pseudo-class to style things without the need to override it with a second unnecessary declaration to undo the first one,
but now I came across a weird behaviour where Safari accepts descendant selectors within the :not(), but Chrome doesn't.
我使用了類似 a:not(.blue a).
我搜索了答案，但我仍然不完全理解原因.
I searched for answers, but I still don't fully understand the reason.
Are descendant selectors really allowed by the spec?
這是一個演示:
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>
http://codepen.io/oscarmarcelo/pen/YqboQJ?editors=1100
推薦答案
在 Selectors Level3，答案是否定的.:not() 表示法只接受 簡單的選擇器.
In Selectors Level 3, the answer would be NO. The :not() notation accepts only simple selectors.
6.6.7.否定偽類
否定偽類:not(X)是一個函數式記號簡單選擇器(不包括否定偽類本身)作為爭論.它表示一個元素，它沒有被它的論據.
The negation pseudo-class, :not(X), is a functional notation taking
a simple selector (excluding the negation pseudo-class itself) as an
argument. It represents an element that is not represented by its
argument.
什么是簡單選擇器?
來自選擇器語法:
簡單選擇器可以是類型選擇器、通用選擇器、屬性選擇器、類選擇器、ID 選擇器或偽類.
A simple selector is either a type selector, universal selector, attribute selector, class selector, ID selector, or pseudo-class.
與后代選擇器無關.
但是，在 選擇器級別4，:not() 接受復雜選擇器，其中包括后代組合器.瀏覽器對該規范的支持仍然很弱.
HOWEVER, in Selectors Level 4, :not() accepts complex selectors, which would include descendant combinators. Browser support is still quite weak for this specification.
這篇關于:not() 否定是否接受后代選擇器?的文章就介紹到這了，希望我們推薦的答案對大家有所幫助，也希望大家多多支持html5模板網！