在HTML中可以通過CSS來控制網(wǎng)頁的樣式,然而多個(gè)CSS規(guī)則的作用可能會(huì)出現(xiàn)沖突。這時(shí)就需要使用CSS權(quán)重值來判斷規(guī)則的優(yōu)先級(jí)。CSS權(quán)重值由四個(gè)部分組成,分別是:
內(nèi)聯(lián)樣式:1000 ID選擇器:100 類選擇器、屬性選擇器、偽類選擇器:10 元素選擇器、偽元素選擇器:1
樣式的優(yōu)先級(jí)是由這四個(gè)部分的值相加得出的。比如一個(gè)元素同時(shí)有內(nèi)聯(lián)樣式和一個(gè)類選擇器,那么這個(gè)規(guī)則的權(quán)重值就是10 + 1000 = 1010。
如果多個(gè)規(guī)則的權(quán)重值相同,則前面出現(xiàn)的規(guī)則優(yōu)先級(jí)更高。比如:
p { color: red; } #content p { color: blue; }
一個(gè)p元素在兩個(gè)規(guī)則中都能匹配上,但是第二個(gè)規(guī)則的權(quán)重值更高,因?yàn)樗褂昧薎D選擇器。
CSS權(quán)重值在編寫樣式時(shí)非常有用,特別是在處理層疊樣式(CSS規(guī)則的沖突)時(shí)。當(dāng)出現(xiàn)樣式?jīng)_突時(shí),我們可以通過增加權(quán)重值來解決。不過,在編寫CSS的過程中還是應(yīng)盡量避免使用內(nèi)聯(lián)樣式和ID選擇器,以免出現(xiàn)大量的優(yōu)先級(jí)相等的規(guī)則。