css有四種加載樣式的方式：內聯、syle標簽、link、import。這四種方式均可以影響html的樣式。假設你分別用這四種方式定義了一個div的樣式，如果你能確定這四種方式修改的內容均不沖突那就再好不過了。但現實往往不是這樣的。假如我通過在外部css定義了背景為紅色，內聯樣式中又定義了藍色，最終的效果是怎樣的？這里就存在一個優先級的問題。 #### 使用計數法計算優先級 現在定義一個四位數，給它初始化0 0 0 0，對于css的每一個選擇器，使用如下規則： 1.每有一個id選擇符，百位+1 2.每有一個class選擇符，十位+1 3.每有一個標簽元素、偽類，個位+1 4.其它選擇符（例如通配符），不變 如果存在樣式沖突，對比二者的四位數大小，最終采用較大者。 注：在優先級相同的情況下，后定義的樣式優先級更高。 <br> 下面來舉一些例子 ~~~ /*存在一個<div id="iDiv" class="cDiv"></div>*/ #iDiv{ background-color: black; } .cDiv{ background-color: red; } /*.iDiv(0 1 0 0)>#cDiv(0 0 1 0) 最終樣式為red*/ ~~~ ~~~ /*存在一個<div><p>SunnyChuan</p><div>*/ div p{ color:red; } p{ color:blue; } /*前者0 0 0 2,后者0 0 0 1 最終樣式為red*/ ~~~ ~~~ /*更加復雜*/ #iDiv .cDiv p a:hover{ margin:0 auto; width:100px; height:100px; /*0 1 1 3*/ } ~~~ 同一文件中的樣式優先級可以通過計數法來算出，假設div既有內聯又有導入并且二者對某一樣式同時定義了呢？css規范指出：內聯 > style > 外部導入。此外還需注意，帶有!important標識的樣式優先級最高并且無視上述所有標準。因此在實際開發中因盡量避免通過important來指定最高優先級而是通過計算進而提升某一樣式的優先級。