css權重優先級
阿新 • • 發佈：2018-03-19
css left containe container lac style ant con imp
從CSS代碼存放位置看權重優先級：內嵌樣式 > 內部樣式表 > 外聯樣式表。其實這個基本可以忽視之，大部分情況下CSS代碼都是使用外聯樣式表。
從樣式選擇器看權重優先級：important > 內嵌樣式 > ID > 類 > 標簽 | 偽類 | 屬性選擇 > 偽對象 > 繼承 > 通配符。
- important的權重為1,0,0,0
- ID的權重為0,1,0,0
- 類的權重為0,0,1,0
- 標簽的權重為0,0,0,1
- 偽類的權重為0,0,1,0
- 屬性的權重為0,0,1,0
- 偽對象的權重為0,0,0,1
- 通配符的權重為0,0,0,0
<html> <head> <style type="text/css"> #left{color:black!important;} /*1,1,0,0*/ #container #left{color:red;} /*0,2,0,0*/ #left{color:green!important;} /*1,1,0,0*/ .container #left{color:blue;} /*0,1,1,0*/ </style> </head> <body> <div class="container" id="container"> <span id="left">這到底是什麽顏色啊？</span> </div> </body> </html>
<!-- 2個#left的權重都是1,1,0,0 這個時候就采用最後定義原則，所以最後輸出的姿態是綠色的。-->
css權重優先級