:not()是什麼？ :not()的簡單使用

本篇文章跟大家介紹:not()是什麼？ :not()的簡單使用，讓大家了解:not()是如何使用的。有一定的參考價值，有需要的朋友可以參考一下，希望對你們有幫助。

:not()是CSS的一個否定偽類別選擇器。它是一個函數式偽類選擇器，它可以將一個簡單選擇器（如下所示）作為參數，然後匹配一個或多個不由參數表示的元素。

能作為:not()參數的可以是以下任何一種的簡單選擇器：

1、標籤選擇器（例如p，span等）

#2 、類別選擇（例如.element，.sidebar等）

3、ID選擇器（例如#header）

4、偽類選擇器（例如:first-child，:last- of-type）

5、屬性選擇器（例如[type="checkbox"]）

#6、通用選擇器（*）

但是，傳遞給: not()的參數不能是偽元素選擇器（例如::before和::after等）或另一個否定偽類選擇器。

因此，以下是無效 :n​​ot()值：

/* 无效 */
p:not(:not(.same)) {}

p:not(:not(:last-child)) {}

:not(::first-letter) {}

a:not(::after) {}

從上面的範例可以看出，:not()不能被嵌套，例:not(:not(.. ))。它還不能嵌套在:matches()偽類中，例：selector（:matches(:not(..))）。

如前所述，:not()選擇器將符合其參數中未由選擇器表示的元素。所以，這條css語句：：

li:not(.new) {    
  /* 所有样式列表项，除了具有新类的项之外*/
}

將選擇除具有.new類別名稱的清單項目之外的所有清單項目。

:not()選擇是可連結更多的:not()選擇。例如，以下內容將匹配article除ID之外的所有s #featured，然後將過濾掉具有類別名稱的文章.tutorial：

article:not(#featured):not(.tutorial) {    
     /* 格式化文章 */
}

:not()還可以與其他偽類和偽元素鏈接。例如，以下將.old使用::after偽元素新增「新！」單字以列出沒有類別名稱的項目：

li ：not（.old）:: after {     
   content：“New！” ;    
   color：deepPink;
}

說明：

:not()偽類別選擇允許寫入無用的選擇。例如:not(*)，它根本不代表任何元素將永遠不會套用任何樣式。

總結：以上就是這篇文章的全部內容，希望能對大家的學習有所幫助。

以上是:not()是什麼？ :not()的簡單使用的詳細內容。更多資訊請關注PHP中文網其他相關文章！