1. id選擇器(#myid) 根據id的值選擇元素
2. 類選擇器(.myclassname) 根據class的值選擇元素
3. 標簽選擇器(div,h1,p) 根據標簽選擇元素
4.相鄰選擇器/兄弟選擇器(h1+p) 匹配緊跟第一個選擇器,並且匹配第二個選擇器內的元素,如緊跟h1元素后的p元素
5.子選擇器(ul>li) 匹配第二個選擇器,且為第一個選擇器內元素的后代
6.后代選擇器(li a) 先匹配第二個選擇器的元素,並且屬於第一個選擇器內
7.通配符選擇器(*) 選擇所有元素
8.屬性選擇器(a[rel="external"]) 根據屬性選擇元素
9.偽類選擇器(a:hover,li:nth-child) 偽選擇器不是直接對應HTML 中定義的元素,而是向選擇器增加特殊效果
偽元素
偽類
10 並集選擇器(em,strong{}) 同時匹配多個選擇器,取多個選擇器的並集
選擇器權重
ID選擇器 #id{} +100
類 屬性 偽類 +10
元素 偽元素 +1
其他選擇器 +0
注意例外事項
!importtant 優先級最高
元素屬性 優先級最高
相同權重 后寫的生效