一重要選擇器
E,F 多元素選擇器,同時匹配所有E元素或F元素,E和F之間用逗號分隔 div,p { border:1px solid #ccc;}
E F 后代元素選擇器,匹配所有屬于E元素后代的F元素,E和F之間用空格分隔 div p{color:red;}
E > F 子元素選擇器,匹配所有E元素的子元素F div > strong { color:#f00; }
E + F 毗鄰元素選擇器,匹配所有緊隨E元素之后的同級元素F p + p { color:#f00; }
E:nth-child(n) 這個屬性默認父元素的第n個子元素E 如果沒有父元素那么他的父元素就是body
此屬性可以實現(xiàn)奇偶 2n 2n+1
E:nth-of-type()從字面意思就很好理解了。選擇第n個E元素.沒有父級元素的限制
三、選擇器的優(yōu)先級
從高到低依次是:
1.在屬性后面使用 !important會覆蓋頁面內(nèi)任何位置定義的元素樣式
2.作為style屬性寫在元素標簽上的內(nèi)聯(lián)樣式
3.id選擇器
4.類選擇器
5.偽類選擇器
6.屬性選擇器
7.標簽選擇器
8.通配符選擇器
9.瀏覽器自定義
實際上,同一個元素可以使用多個規(guī)則來指定它的字體顏色,每個規(guī)則都有自己的選擇器。顯然最終只有一個規(guī)則起作用(不可能一個字既是紅色又是綠色),那么該規(guī)則的特殊性最高,特殊性即css優(yōu)先級。那么CSS的優(yōu)先級怎么計算呢?
選擇器的特殊性值表述為4個部分,用0,0,0,0表示。
ID選擇器的特殊性值,加0,1,0,0;
類選擇器、屬性選擇器或偽類,加0,0,1,0;
元素和偽元素,加0,0,0,1;
通配選擇器對特殊性沒有貢獻,即0,0,0,0;
最后比較特殊的一個標志!important(權(quán)重),它沒有特殊值,但是他的優(yōu)先級是最高的,為了方便記憶,可認為他的默認值是1,0,0,0.