層疊 知識圖譜
CSS本質(zhì)
CSS 本質(zhì)上就是聲明規(guī)則羽莺，即在各種條件下实昨，我們希望產(chǎn)生特定的效果。瀏覽器會根據(jù)我們書寫的規(guī)則去決定如何渲染頁面盐固。
什么是層疊
層疊指的就是css中的一系列規(guī)則荒给。決定了如何解決沖突丈挟，是 CSS 語言的基礎(chǔ)。
層疊規(guī)則
這些規(guī)則就是拿來解決沖突的志电。
(1) 樣式表的來源：樣式是從哪里來的曙咽，包括你的樣式和瀏覽器默認樣式等。
(2) 選擇器優(yōu)先級：哪些選擇器比另一些選擇器更重要挑辆。
(3) 源碼順序：樣式在樣式表里的聲明順序
術(shù)語解釋
@規(guī)則（at-rules）是指用“@”符號開頭的語法例朱。比如@import 規(guī)則或者@media 查詢
樣式表的來源
作者樣式表
我們自己寫的樣式表就是作者樣式表
用戶代理樣式表
瀏覽器有一個默認的樣式表，也就是用戶代理樣式表鱼蝉。
用戶樣式表
這是第三種來源洒嗤，它的優(yōu)先級介于 用戶代理樣式表和作者樣式表之間。用戶樣式表很少見蚀乔，并且不受網(wǎng)站作者控制烁竭，因此 這里略過
1. 用戶代理樣式
瀏覽器先應(yīng)用用戶代理樣式后才會應(yīng)用作者樣式表，后者會覆蓋前者吉挣。
2. !important 聲明
標(biāo)記了!important 的聲明會被當(dāng)作更高優(yōu)先級的來源派撕，因此總體的優(yōu)先級按照由高到低
優(yōu)先級分別是 !important > 作者樣式表 > 用戶代理樣式表
理解優(yōu)先級
1.行內(nèi)樣式
在HTML 的 style 屬性直接寫樣式，優(yōu)先級最高睬魂，覆蓋任何來自樣式表或者<style>標(biāo)簽的樣式终吼。
2. 選擇器優(yōu)先級
有3大類選擇器。他們有不同的優(yōu)先級氯哮。
如果選擇器的 ID 數(shù)量更多际跪，則它會勝出（即它更明確）。
如果 ID 數(shù)量一致喉钢，那么擁有最多類的選擇器勝出姆打。
如果以上兩次比較都一致，那么擁有最多標(biāo)簽名的選擇器勝出肠虽。
口訣是遇同級比數(shù)量幔戏，遇不同級，找高級税课，全一樣闲延，看先后，后者勝韩玩。
3. 優(yōu)先級標(biāo)記
一個常用的表示優(yōu)先級的方式是用數(shù)值形式來標(biāo)記垒玲，通常用逗號隔開每個數(shù)。
“1,2,2” 表示選擇器由 1 個 ID找颓、2 個類合愈、2 個標(biāo)簽組成。
有3數(shù)和4個數(shù)的寫法。4個數(shù)的寫法多了一個數(shù)表示代表一個聲明是否 是用行內(nèi)樣式添加的想暗。用0,1表示妇汗。
源碼順序
如果兩個聲明的來源和優(yōu)先級相同帘不，其中一個 聲明在樣式表中出現(xiàn)較晚说莫，或者位于頁面較晚引入的樣式表中，則該聲明勝出寞焙。
a鏈接屬性書寫順序
a:link {
color: blue;
text-decoration: none;
}
a:visited {
color: purple;
}
a:hover {
text-decoration: underline;
}
a:active {
color: red;
}
記憶：LV好按⑾痢（lvha）
兩條經(jīng)驗法則
1.能不用!important就不用。
2.在選擇器中不要使用 ID
本文由mdnice多平臺發(fā)布
