1、屬性選擇器
屬性選擇器，可以根據元素特定的屬性來選擇元素，這樣就不用借助 類 或者 id選擇器。
E [ att ] 選擇具有 att 屬性的 E 元素 例如：input [ value ]
E [ att = 'val' ] 選擇具有 att 屬性且屬性值等於 val 的 E元素
E [ att = 'val' ] 選擇具有 att 屬性且屬性值等於 val 的 E元素
E [ att ^= 'val' ] 選擇具有 att 屬性且屬性值以 val 開頭的 E元素
E [ att $= 'val' ] 選擇具有 att 屬性且屬性值以 val 結尾的 E元素
E [ att *= 'val' ] 選擇具有 att 屬性且屬性值含有 val 的 E元素
注意：類選擇器，屬性選擇器，偽類選擇器 權重都是 10
2、結構偽類選擇器（一般用於選擇父級里面的第幾個孩子）
父元素 E:first-child 父元素中的第一個子元素 E
父元素 E:last-child 父元素中的最后一個子元素 E
父元素 E:nth-child( n ) 父元素中的第 N 個子元素 E
注意：
ul :first-child{ color:pink; } // 選擇 ul 下的第一個子元素（ 第一個子元素可以使 div，p，span任何子元素）
ul li:first-child{ color: pink; } // 選擇 ul 下的第一個元素名是 li 的子元素
nth-child( n ) 注意點：（n 可以是數字，關鍵字和公式）
數字：選擇第 n 個子元素，里面數字從 1 開始
關鍵字： even 偶數，odd 奇數
ul li:nth-child( even ) // 選擇 ul 中所有 偶數行的 li 子元素
公式：常見公式如下（如果 n 是公式，則從 0 開始計算，但是第 0 個元素 或者超出了元素的個數會被忽略）
ul li:nth-child( n ) // 從 0 開始 每次加1 往后計算，相當於選擇了所有的孩子 這里面必須是 n 不能是其他字母
偶數：2n 奇數：2n+1 5的倍數：5n 從第5個開始（包含第5個）到最后：n+5 前5 個（包含第5 個）：-n + 5
E:first-of-type：指定類型 E 的第一個
E:last-of-type：指定類型 E 的最后一個
E:nth-of-type( n )：指定類型 E 的第 n 個
區別：（兩種相反的查找模式）
1. nth-child 對父元素里面所有孩子排序選擇（序號是固定的）先找到第 n 個孩子，然后看看是否和 E 匹配
2. nth-of-type 對父元素里面指定子元素進行排序選擇。先去匹配 E ，然后再根據 E 找第 n 個孩子
3. 偽元素選擇器（重點）
偽元素選擇器 可以幫助我們 利用 css 創建新標簽元素，而不需要 HTML 標簽，從而簡化 HTML 結構
:: before 在元素內部的前面插入內容
:: after 在元素內部的后面 插入內容
注意：
before 和 after 創建一個元素，但是屬於行內元素
新創建的這個元素在文檔樹種是找不到的，所以我們稱為偽元素
語法：element::before{ }
before 和 after 必須有 content 屬性
before 在父元素內容的前面創建元素，after 在父元素內容的后面插入元素
偽元素選擇器 和 標簽選擇器一樣，權重為 1
4、結構偽類
:target 表示對當前活動窗口的控制