在進(jìn)行css布局中，經(jīng)常會使用到權(quán)重，那么權(quán)重是什么意思呢？

css的權(quán)重的順序為：

important > 內(nèi)聯(lián) > ID > 類 > 標(biāo)簽 | 偽類 | 屬性選擇 > 偽對象 > 通配符 > 繼承

根據(jù)CSS 規(guī)范，具體性越明確的樣式規(guī)則，權(quán)重值越高。

那么如何計算權(quán)重值呢，下面這張圖可以說明計算方法

上圖中我們把權(quán)重分為4個等級，每個等級代表一類選擇器，每個等級的值為其所代表的選擇器的個數(shù)乘以這一等級的權(quán)值，最后把所有等級的值相加得出選擇器的特殊值就是權(quán)重。

4個等級的定義如下：

1.等級一：代表內(nèi)聯(lián)樣式，如: style=””，權(quán)值為1000。

2.等級二：代表ID選擇器，如：#content，權(quán)值為100。

3.等級三：代表類，偽類和屬性選擇器，如.content，權(quán)值為10。

4.等級四：代表類型選擇器和偽元素選擇器，如div p，權(quán)值為1。

上圖中選擇器“ul#NAV LI.ACTIVE A”

權(quán)重計算：UL.LI,A為等級四權(quán)值為1；#NAV為等級二權(quán)值為100；I.ACTIVE為等級三權(quán)值為10，加在一起為113。

下面我們來看一下，權(quán)重的使用

這里我們做了一個類似京東的導(dǎo)航條，在手機京東這個導(dǎo)航條里，放了一個圖片

設(shè)置手機京東的html代碼為

在插入圖片之前，要設(shè)置li的左右邊距

css代碼如下：

.tel-jd{

padding: 0 25px;

background: url();

}

運行之后，效果如下，并沒有設(shè)置邊距

當(dāng)我們將代碼修改如下

.shortcut .tel-jd{

/*上右下左,把左側(cè)整大點*/

padding: 0 20px 0 25px;

position: relative;

}

.shortcut是.tel-jd的祖先元素

運行之后

這就是權(quán)重使用的必要性。