1. 程式人生 > >多重樣式優先級深入概念

多重樣式優先級深入概念

AS 頁面 就是 調試 only 經驗 概念 優先 port

什麽是優先級

優先級是瀏覽器通過判斷哪些屬性值與元素最相關以決定並應用到該元素上的。優先級僅由選擇器組成的匹配規則決定的。

優先級就是分配給指定的CSS聲明的一個權重,它由匹配的選擇器中的每一種選擇器類型的數值決定。

優先級順序

下列是一份優先級逐級增加的選擇器列表:

  • 通用選擇器(*)
  • 元素(類型)選擇器
  • 類選擇器
  • 屬性選擇器
  • 偽類
  • ID 選擇器
  • 內聯樣式

!important 規則例外

當 !important 規則被應用在一個樣式聲明中時,該樣式聲明會覆蓋CSS中任何其他的聲明, 無論它處在聲明列表中的哪裏. 盡管如此, !important規則還是與優先級毫無關系.使用 !important 不是一個好習慣,因為它改變了你樣式表本來的級聯規則,從而使其難以調試。

一些經驗法則:

  • Always 要優化考慮使用樣式規則的優先級來解決問題而不是 !important
  • Only 只在需要覆蓋全站或外部 css的特定頁面中使用 !important
  • Never 永遠不要在全站範圍的 css 上使用 !important
  • Never 永遠不要在你的插件中使用 !important

多重樣式優先級深入概念