CSS層疊水平是指在Web開發(fā)中，當(dāng)多個(gè)CSS規(guī)則共同作用于一個(gè)元素時(shí)，瀏覽器通過一定的規(guī)則決定哪些規(guī)則優(yōu)先級(jí)更高，被應(yīng)用到元素上。

.red {
color: red;
}
p {
color: blue;
}
/*元素樣式*/
Hello World!
/*輸出的樣式*/
color: red;

CSS規(guī)則的優(yōu)先級(jí)由四個(gè)因素決定，分別是重要性、來源、特殊性和順序。

1. 重要性：HTML中的style屬性及!important聲明的優(yōu)先級(jí)最高，其次是用戶代理樣式表和普通樣式表，最后是默認(rèn)樣式表。
2. 來源：內(nèi)聯(lián)樣式表的優(yōu)先級(jí)最高，其次是ID選擇器、類選擇器、屬性選擇器，最后是標(biāo)簽選擇器和通配符選擇器。
3. 特殊性：選擇器中有多個(gè)ID選擇器時(shí)優(yōu)先級(jí)最高，其次是類選擇器、屬性選擇器、標(biāo)簽選擇器，最后是通配符選擇器。
4. 順序：最后定義的樣式優(yōu)先級(jí)最高。

/*樣式1*/
p {
color: blue;
}
/*樣式2*/
.red {
color: red;
}
/*樣式3*/
p.red {
color: green;
}
/*輸出的樣式*/
color: green;

在上面的示例中，三個(gè)樣式規(guī)則都作用于同一個(gè)元素

，其中樣式3優(yōu)先級(jí)最高，它特指p且有class為red的元素，故顏色為綠色。

在編寫CSS樣式時(shí)，應(yīng)該盡量減少使用!important聲明，避免過度使用內(nèi)聯(lián)樣式，盡可能使用較為具體的選擇器，以及避免樣式?jīng)_突、樣式污染問題。