權值有的時候我們為同一個元素設定了不同的CSS樣式程式碼

特殊性
有的時候我們為同一個元素設定了不同的CSS樣式程式碼，那麼元素會啟用哪一個CSS樣式呢?我們來看一下面的程式碼：

p{color:red;}
.first{color:green;}
三年級時，我還是一個膽小如鼠的小女孩。

p和.first都匹配到了p這個標籤上，那麼會顯示哪種顏色呢？green是正確的顏色，那麼為什麼呢？是因為瀏覽器是根據權值來判斷使用哪種css樣式的，權值高的就使用哪種css樣式。

下面是權值的規則：

標籤的權值為1，類選擇符的權值為10，ID選擇符的權值最高為100。例如下面的程式碼：

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

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

任務
我來試一試：為“膽小如鼠”這幾個文字設定顏色為紫色

要求：為“膽小如鼠”這幾個文字設定權值更高的CSS樣式程式碼來覆蓋以前的CSS樣式程式碼

在第11行輸入下面的程式碼：

p span{color:purple;}
或

p>span{color:purple;}