<option id="sqsoa"></option>

否定偽類:not(s) | CSS-Tricks

betacat 發布于2019-08-29 18:45 / 940人閱讀

摘要：是中的一個否定偽類選擇器，并且接受一個簡單的選擇器作為參數。否定偽類選擇器不支持嵌套，所以是永遠不被允許的。開發者需要注意偽元素不是簡單選擇器，因此作為偽類的參數是無效的。在選擇器下鏈式使用另一個選擇器也是禁止的。

:not(X)是CSS中的一個否定偽類（選擇器），并且接受一個簡單的選擇器作為參數。本質上，可以使任一其他選擇器（作為參數）。

:not（選擇器）匹配傳遞參數選擇器未選擇的元素。傳遞參數或許不包括增加的選擇器或者偽元素選擇器。

/* the X argument can be replaced with any simple selectors */
:not(X) {
  property: value;
}

在這個例子中，有一個class為“different”的li元素：

CSS將會選擇除了class為“different”外的所有li元素。

/* Style everything but the .different class */
li:not(.different) {
  font-size: 3em;
}

可以將偽類選擇器應用到所有簡單選擇器（包括元素類型選擇器、通用選擇器、屬性選擇器、類選擇器、ID選擇器、偽類選擇器）上來產生同樣的效果。

p:not(:nth-child(2n+1)) {
  font-size: 3em;
}

但是如果我們使用偽元素選擇器作為參數將不會產生我們預期的效果。

:not(::first-line) { /* ::first-line is a pseudo element selector and not a simple selector */
  color: white;
}

:not()多種用法可視化表示圖

:not()偽類的優先級是其參數的優先級。:not()偽類并不會像其他偽類選擇器那樣給選擇器增加優先級。

否定偽類選擇器不支持嵌套，所以:not(:not(...))是永遠不被允許的。開發者需要注意偽元素不是簡單選擇器（simple selector），因此作為:not()偽類的參數是無效的。另外，當使用屬性選擇器時也需要注意，因為部分屬性選擇器不被普遍支持。在:not()選擇器下鏈式使用另一個:not()選擇器也是禁止的。

學習更多的CSS技術可以關注我的博客：CODECOLOR

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/114551.html

否定偽類:not(s) | CSS-Tricks

摘要：是中的一個否定偽類選擇器，并且接受一個簡單的選擇器作為參數。否定偽類選擇器不支持嵌套，所以是永遠不被允許的。開發者需要注意偽元素不是簡單選擇器，因此作為偽類的參數是無效的。在選擇器下鏈式使用另一個選擇器也是禁止的。 :not(X)是CSS中的一個否定偽類（選擇器），并且接受一個簡單的選擇器作為參數。本質上，可以使任一其他選擇器（作為參數）。 :not（選擇器）匹配傳遞參數選擇器未選擇的...

summerpxy 2019-08-02 16:15 評論0 收藏0
重學前端學習筆記（二十一）--如何選中svg里的a元素？

摘要：二選擇器的基本意義根據一些特征，選中元素樹上的一批元素。四偽類選擇器樹結構關系偽類選擇器偽類表示樹的根元素。偽類表示沒有子節點的元素。表示焦點落在這個元素之上。用于選中瀏覽器的部分所指示的元素。筆記說明重學前端是程劭非（winter）【前手機淘寶前端負責人】在極客時間開的一個專欄，每天10分鐘，重構你的前端知識體系，筆者主要整理學習過程的一些要點筆記以及感悟，完整的可以加入wint...

jemygraw 2019-08-26 13:51 評論0 收藏0
重學前端學習筆記（二十一）--如何選中svg里的a元素？

摘要：二選擇器的基本意義根據一些特征，選中元素樹上的一批元素。四偽類選擇器樹結構關系偽類選擇器偽類表示樹的根元素。偽類表示沒有子節點的元素。表示焦點落在這個元素之上。用于選中瀏覽器的部分所指示的元素。筆記說明重學前端是程劭非（winter）【前手機淘寶前端負責人】在極客時間開的一個專欄，每天10分鐘，重構你的前端知識體系，筆者主要整理學習過程的一些要點筆記以及感悟，完整的可以加入wint...

CloudwiseAPM 2019-08-30 10:57 評論0 收藏0
重學前端學習筆記（二十一）--如何選中svg里的a元素？

摘要：二選擇器的基本意義根據一些特征，選中元素樹上的一批元素。四偽類選擇器樹結構關系偽類選擇器偽類表示樹的根元素。偽類表示沒有子節點的元素。表示焦點落在這個元素之上。用于選中瀏覽器的部分所指示的元素。筆記說明重學前端是程劭非（winter）【前手機淘寶前端負責人】在極客時間開的一個專欄，每天10分鐘，重構你的前端知識體系，筆者主要整理學習過程的一些要點筆記以及感悟，完整的可以加入wint...

IamDLY 2019-08-02 15:06 評論0 收藏0