有的時(shí)候我們?yōu)橥粋€(gè)元素設(shè)置了不同的CSS樣式代碼，那么元素會(huì)啟用哪一個(gè)CSS樣式呢？下面我們一起來(lái)看一下代碼：

p{color:red;}
.first{color:green;}
<p class="first">三年級(jí)時(shí)，我還是一個(gè)<span>膽小如鼠</span>的小女孩。</p>

p和.first都匹配到了p這個(gè)標(biāo)簽上，那么會(huì)顯示哪種顏色呢？green是正確的顏色，那么為什么呢？是因?yàn)闉g覽器是根據(jù)權(quán)值來(lái)判斷使用哪種css樣式的，權(quán)值高的就使用哪種css樣式。

下面是權(quán)值的規(guī)則：

標(biāo)簽的權(quán)值為1，類選擇符的權(quán)值為10，ID選擇符的權(quán)值最高為100。例如下面的代碼：

p{color:red;} /*權(quán)值為1*/
p span{color:green;} /*權(quán)值為1+1=2*/
.warning{color:white;} /*權(quán)值為10*/
p span.warning{color:purple;} /*權(quán)值為1+1+10=12*/
#footer .note p{color:yellow;} /*權(quán)值為100+10+1=111*/

注意：還有一個(gè)權(quán)值比較特殊--繼承也有權(quán)值但很低，有的文獻(xiàn)提出它只有0.1，所以可以理解為繼承的權(quán)值最低。