是因為瀏覽器是根據權值來判斷使用哪種css樣式的，權值高的就使用哪種css樣式。
下面是權值的規則：
標籤的權值為1，類選擇符的權值為10，id選擇符的權值最高為100。例如下面的**：
下面，再來看一些例子吧？
#content div#main-content h2
三年級時，我還是乙個膽小如鼠的小女孩。
最後 p 中的文字會設定為green，這個層疊很好理解，理解為後面的樣式會覆蓋前面的樣式。
所以前面的css樣式優先順序就不難理解了：
內聯樣式表（標籤內部）> 嵌入樣式表（當前檔案中）> 外部樣式表（外部檔案中）。
有些特殊的情況需要為某些樣式設定具有最高權值，怎麼辦？這時候我們可以使用!important來解決。
!important最高優先順序
如下**：
p p
三年級時，我還是乙個膽小如鼠的小女孩。
這時 p 段落中的文字會顯示的red紅色。
注意：!important要寫在分號的前面
注意：當網頁製作者不設定css樣式時，瀏覽器會按照自己的一套樣式來顯示網頁。並且使用者也可以在瀏覽器中設定自己習慣的樣式，比如有的使用者習慣把字型大小設定為大一些，使其檢視網頁的文字更加清楚。這時注意樣式優先順序為：瀏覽器預設的樣式 < 網頁製作者樣式 < 使用者自己設定的樣式，但記住!important優先順序樣式是個例外，權值高於使用者自己設定的樣式。
參考：
慕課網：
csdn：
css 特殊性 權重排列
首先類似於二進位制的理解。0010大於0001。id 0,1,0,0 class,屬性值 偽類 0,0,1,0 元素 偽元素 0,0,0,1 偽元素 before after,first line,first letter 0,0,0,1 0,0,0，0 大於繼承值 important 就像 1,0...
特殊性 權值
有的時候我們為同乙個元素設定了不同的css樣式 那麼元素會啟用哪乙個css樣式呢?我們來看一下面的 p first p class first 三年級時，我還是乙個 span 膽小如鼠 span 的小女孩。p p和.first都匹配到了p這個標籤上，那麼會顯示哪種顏色呢？green是正確的顏色，那麼...
CSS css特殊性 優先順序 權重
css選擇器可以用多種方式去選擇元素，實際上乙個元素可以由使用兩個或者多個規則來匹配，每個規則都有各自的選擇器。請看例子 css h1 body h1 h2.grade h2 然後是特別長的乙個選擇器 html body table tr id totals td ul li li answer各自...