CSS :not() 是否選擇性地排除遠親？

距離後代和 CSS :not() 選擇器

CSS3 :not() 偽類旨在否定特定選擇器匹配。它已在瀏覽器中廣泛實現。然而，圍繞此選擇器的一個常見誤解是它對遙遠後代的適用性。

雖然 :not() 成功地否定了直接子元素的匹配，但對於更遙遠的後代，它的行為並不符合預期。如提供的範例所示：

在此片段中，

元素仍然從其父級

繼承紅色，即使它不是

的直接後代。發生這種情況是因為 :not() 僅直接否定該元素的匹配，而不是其後代。

CSS3 和 CSS 選擇器等級 4 中的 :not() 文件沒有明確解決此行為。不過，已經證實這種行為是故意的，選擇者並不意味著支援孫子匹配。

解

達到預期的結果從 :not() 匹配中排除遠親後代，必須使用不同的方法。常見的方法是為要排除的特定元素指定顏色，覆寫任何繼承的值：

CSS 選擇器等級4 增強

CSS 選擇器第4 級提出了對:not() 選擇器的增強，允許在其中使用更複雜的選擇器。此變更將使以下語法能夠正確地否定後代：

雖然此增強功能尚未在瀏覽器中廣泛實現，但它為使用:not() 匹配和否定遠距離後代提供了一個有前景的解決方案。

以上是CSS :not() 是否選擇性地排除遠親？的詳細內容。更多資訊請關注PHP中文網其他相關文章！