在CSS中,不同的選擇器會有不同的權重值來決定哪個樣式會被應用到元素上,當多個規則與同一個元素匹配時,權重值決定了哪個樣式會最終生效。
從權重值最高的選擇器到最低的選擇器,依次為:
1. !important聲明 2. 內聯樣式 (樣式直接寫在元素標簽的style屬性中) 3. ID選擇器 (#id) 4. 類選擇器、屬性選擇器、偽類選擇器 ( .class、[attribute]、:hover) 5. 元素選擇器、偽元素選擇器 (如 p、::before)
需要注意的是,當權重值相同的時候,后聲明的規則會覆蓋先聲明的規則,稱為“層疊”。更具體地說,權重值高的選擇器可以覆蓋掉權重值低的選擇器,但權重值相同的選擇器會以后聲明的為準。
因此,盡管!important聲明權重值最高,但是濫用!important規則會導致代碼難以維護和理解,影響網站性能。正確的做法是,在遵循CSS的權重值規則的前提下,盡量簡潔明了地書寫CSS代碼。
上一篇css按需引用字體
下一篇css按鈕字居中對齊