古之立大事者，不惟有超世之才，亦必有堅忍不拔之志。——蘇軾這篇部落格主要介紹 css 選擇器中的偽類選擇器，其中包含什麼是偽類選擇器，偽類選擇器的分類和用法。
偽類選擇器的使用離不開我們之前介紹的 css 選擇器，而且用法和作用比較特殊，接下來進入正題
偽類選擇器是一種通過允許通過沒有包含在 html 元素的狀態資訊來定位 html 元素的用法。它並不會改變任何 html **結構。只是插入了一些修飾元素，這些元素僅僅是對用於可見的，在 html 結構中並不可見。
由於狀態可能是動態變化的，當元素到達某個狀態時，例如 滑鼠懸停或者獲取焦點 時這個元素就會動態的進行變化，當滑鼠離開或者失去焦點之後狀態又進行變化，由此可以看出，它的功能和 class 有些類似，但它是基於文件之外的抽象，所以叫偽類。
偽類選擇器的具體用法就是想已有的選擇器增加關鍵字，表示定位 html 元素的狀態資訊。
例如：:hover偽類選擇器，就是滑鼠懸停偽類，就是滑鼠懸停時改變元素的狀態，示例**如下所示：
lang
="en"
>
>
charset
="utf-8"
>
name
="viewport"
content
="width=device-width, initial-scale=1.0"
>
>
偽類選擇器title
>
>
pp:hover
style
>
head
>
>
>
這是一段文字p
>
body
>
html
>
[外鏈轉存失敗,源站可能有防盜煉機制,建議將儲存下來直接上傳(img-iecljnej-1606061622991)(imgs/偽類選擇器示例.gif)]
偽類選擇器的語法結構如下所示：
選擇器:偽類
:偽類，這裡一定不要忘記:。
友情提示：css 允許在同乙個選擇器上同時編寫多個偽類選擇器。css 版本從第一版本發展到第三版本，提供的偽類選擇器的數量已經很龐大了。尤其 css3 版本新增了大量的偽類選擇器。
如下圖所示展示了 css 目前提供的所有偽類選擇器
上圖出自 [mozilla 社群](css 參考 - css（層疊樣式表） | mdn (mozilla.org))由於 css 偽類選擇器的數量眾多，為了更好的理解我們可以對其進行分類，這種分類是基於用途的，可以劃分為一下五個階段：
否定偽類選擇器：用來定位與指定選擇器不匹配的 html 元素。
動態偽類選擇器：常與元素配合使用，用來表示使用者的某種行為狀態。
目標偽類選擇器：常與元素配合使用，用來定位當前 html 頁面中唯一乙個目標元素。
元素狀態偽類選擇器：常與表單元件元素配合使用，用來表示表單元件的某種狀態。
結構偽類選擇器：常與元素配合使用，利用 html 元素之間的關係定位目標元素。
以上的 五種選擇器中否定選擇器會在這篇部落格進行介紹，後面的幾種選擇器會在後面的部落格中進行介紹
:not()是否定偽類，如果當前元素與括號裡面的選擇器不匹配，則該偽類會進行匹配。
否定偽類選擇器的語法結構如下所示：
:not(selector)
selector選擇器定位的 html 元素的元素
示例**如下所示：
lang
="en"
>
>
charset
="utf-8"
>
name
="viewport"
content
="width=device-width, initial-scale=1.0"
>
>
偽類選擇器title
>
>
body :not(p)
style
>
head
>
>
>
這是p元素p
>
>
這是div元素div
>
body
>
html
>
否定偽類選擇器具有以下幾點需要注意：
:not()偽類選擇器的優先級別為 0，選擇器最終的優先順序由括號裡的表示式決定。
:not()偽類選擇器可以鏈式使用，如下**所示：
body :not(p) :not(div) :not(span)
:not()偽類選擇器不支援出現選擇符。
使用:not()偽類選擇器的優先如下所示：
可以使**更簡潔。
使我們更好的理解**。
保護了原類名的優先順序，擴充套件性更強，更利於我們後期維護。
通過這篇部落格我們了解了 否定偽類選擇器的用法，掌握了否定偽類選擇器的用法會在以後的重置樣式中得到很好的應用。
邁進前端 07 CSS 選擇器之組合選擇器
古之立大事者，不惟有超世之才，亦必有堅忍不拔之志。蘇軾 這篇部落格主要介紹的是 css 選擇器的第三種分類 組合選擇器。組合選擇器是將我們之前所學習的 css 選擇器的用法結合到一起的一種用法，從定位 html 元素的結果上可以分為如下兩種 正文開始 交集與並集是數學上的知識，這裡我們先介紹乙個其概...
CSS選擇器之偽類選擇器（互動）
link 選取未訪問鏈結 active 選取活動鏈結 單擊某鏈結，未鬆開滑鼠時 visited 選取已被訪問的鏈結。target 鏈結指定的目標 hover 當滑鼠浮在元素上方時。empty css3 選擇的元素裡面沒有任何內容 ie6 8不支援 not css3 排除特定的元素 ie6 8不支援 ...
CSS之偽類選擇器 偽元素
偽元素a link 未訪問的鏈結 a visited 訪問過的鏈結 a hover 滑鼠移動到鏈結上 a active 按住滑鼠不動的時候 提示 在 css 定義中，a hover 必須被置於 a link 和 a visited 之後，才是有效的。提示 在 css 定義中，a active 必須被...