CSS層疊性(Cascading)是指在同一元素上應(yīng)用多個樣式時，瀏覽器按照一定的規(guī)則進(jìn)行樣式的應(yīng)用和覆蓋，從而影響元素的最終樣式。權(quán)重(Specificity)指的是CSS選擇器的優(yōu)先級，用于確定應(yīng)用的樣式哪一個具有最高的優(yōu)先權(quán)。
權(quán)重的計算方法如下，按照以下規(guī)則逐級比較：
1. 選擇器的類型(元素選擇器、類選擇器、ID選擇器等)，根據(jù)表格計算權(quán)重，優(yōu)先級從高到低為：
- ID選擇器：權(quán)重為100。
- 類選擇器、屬性選擇器和偽類選擇器：權(quán)重為10。
- 元素選擇器和偽元素選擇器：權(quán)重為1。
2. 如果兩個選擇器都有一樣的權(quán)重，則按照順序進(jìn)行覆蓋，后定義的樣式會覆蓋先定義的樣式。如果樣式定義了!important，優(yōu)先級最高。
3. 組合選擇器中多個選擇器的權(quán)重相加。
舉例說明：
假設(shè)有以下三個選擇器：
如果同時應(yīng)用于同一元素，根據(jù)選擇器的類型計算權(quán)重，可得到：
因此，若樣式規(guī)則沖突產(chǎn)生，則根據(jù)權(quán)重逐級比較，權(quán)重值較高的樣式優(yōu)先生效。但需要注意的是，建議盡量避免使用ID選擇器，因?yàn)樗菀讓SS樣式的復(fù)用和維護(hù)造成影響。
京公網(wǎng)安備 11010802030320號