CSS層疊式是一種非常重要的CSS編寫(xiě)方法。簡(jiǎn)單來(lái)說(shuō)，就是按照一定的優(yōu)先級(jí)來(lái)確定CSS樣式的應(yīng)用順序。當(dāng)有多個(gè)CSS規(guī)則作用于同一個(gè)HTML元素時(shí)，就需要通過(guò)層疊式的方法來(lái)確定優(yōu)先級(jí)，以確保正確的樣式被應(yīng)用。

在CSS層疊式中，使用“選擇器”和“權(quán)重”兩個(gè)因素來(lái)確定樣式的優(yōu)先級(jí)。

h1{
color: red;
}
h1{
color: blue;
}

在上面的例子中，兩個(gè)CSS規(guī)則都針對(duì)同一個(gè)HTML元素h1，但是指定了不同的顏色。根據(jù)優(yōu)先級(jí)規(guī)則，后面的樣式會(huì)覆蓋前面的樣式，因此最終的樣式會(huì)是藍(lán)色。

除了直接在CSS中指定樣式，層疊式還可以使用“繼承”和“重置”兩種方式來(lái)實(shí)現(xiàn)樣式的傳遞和覆蓋。

繼承是指某些樣式可以被子元素繼承。例如：

body{
color: green;
}
p{
font-size: 16px;
}

在上面的例子中，body元素指定了顏色為綠色，而p元素沒(méi)有直接指定顏色。由于p元素是body元素的子元素，因此會(huì)繼承其顏色屬性。

重置是指通過(guò)使用!important標(biāo)記來(lái)打破優(yōu)先級(jí)規(guī)則，強(qiáng)制指定某個(gè)樣式。

p{
font-size: 16px !important;
}

在上面的例子中，樣式規(guī)則通過(guò)使用!important標(biāo)記來(lái)設(shè)置優(yōu)先級(jí)最高，可以覆蓋其他規(guī)則。但是在實(shí)際中，應(yīng)該盡量避免使用!important標(biāo)記，因?yàn)檫^(guò)多的使用會(huì)破壞層疊式的優(yōu)點(diǎn)。