結(jié)構(gòu)與層疊

選擇器的特殊性

特殊性從高到低排列, 同級特殊性相加比較,不能跨級比較

  • 內(nèi)聯(lián)樣式- ID選擇器
  • 類選擇器、屬性選擇器、偽類選擇器
  • 元素選擇器、偽元素選擇器
  • 通配符選擇器
  • 繼承樣式

樣式來源

CSS中的樣式一共有三種來源:創(chuàng)作人員、讀者和用戶代理,來源的不同會影響到樣式的層疊方式

  • 創(chuàng)作人員樣式
    • 前端開發(fā)者寫的那些樣式
  • 用戶代理樣式
    • 瀏覽器提供的默認(rèn)樣式
  • 讀者樣式
    • 瀏覽網(wǎng)頁的用戶通過瀏覽器提供的接口為網(wǎng)站添加的樣式
    • 添加方法:IE可以通過Internet 選項 -> 外觀 -> 輔助功能 -> 用戶樣式表來指定樣式文件。Chrome可以使用Stylish擴(kuò)展來實現(xiàn)
Paste_Image.png

權(quán)重規(guī)則:

  • 讀者!important樣式 > 創(chuàng)作人員!important樣式 > 創(chuàng)作人員正常樣式 >讀者正常樣式 > 用戶代理樣式

層疊規(guī)則

  1. 找出同一個規(guī)則有沖突的所有選擇器
  2. 如果有多個樣式來源,根據(jù)樣式來源的權(quán)重大小確定樣式
  3. 第二點不能確定樣式,根據(jù)選擇器的特殊性高低確定樣式
  4. 第三點不能確定樣式,根據(jù)規(guī)則出現(xiàn)的順序先后確定樣式
最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時請結(jié)合常識與多方信息審慎甄別。
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

友情鏈接更多精彩內(nèi)容