CSS Selector覆蓋順序

bigdevil_s 發布于2019-08-29 11:09 / 959人閱讀

摘要：我們都知道的定義是可以被覆蓋的，但是覆蓋的順序可能并不清楚，本文的目的就在于介紹的覆蓋順序。之間的優先級順序以下是不同之間的優先級，選擇器。終極覆蓋法關鍵字能夠覆蓋一切定義，無視前面提到的優先級順序。

我們都知道CSS的定義是可以被覆蓋的，但是覆蓋的順序可能并不清楚，本文的目的就在于介紹CSS的覆蓋順序。

三種類型CSS的優先級順序

CSS有三種類型:

inline style：以style屬性的形式直接寫在標簽上的

embedded style：寫在html文件的里的

external stylesheet：引用的外部css文件

這三種類型的CSS的優先級就是上面所講的順序。將通俗點就是inline style肯定會覆蓋embedded style的定義，而embedded style肯定會覆蓋external stylesheet的定義。

當然，如果引用多個external stylesheet的話，那么后面的也會覆蓋前面的。

CSS selector之間的優先級順序

以下是不同selector之間的優先級:

The ID selector，ID選擇器。#a{...}

The attribute selector，屬性選擇器。a[target=_blank]{...}

The class selector，類選擇器。.classa{...}

The child selector，子元素選擇器。table > tr {...}

The adjacent sibling selector，相鄰元素選擇器。.classa + .classb {...}

The descendant selector，兒孫輩選擇器。div td {...}

The type selector，元素類型選擇器。input{...}

同樣，在相同的選擇器類型之間后面的會覆蓋前面的定義。

終極覆蓋法

!important關鍵字能夠覆蓋一切定義，無視前面提到的優先級順序。

比如:color:red !important;。不論這段CSS寫在什么地方，還是以什么selector出現，都會覆蓋其他的CSS定義。

參考資料

http://www.w3.org/TR/selector...

http://www.alternategateways....

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/111458.html

關于CSS的個人理解

摘要：的個人理解一概念層疊樣式表，主要由屬性和屬性值組成。如何應用內聯樣式優先級最高，但由于會造成代碼冗余及代碼更新任務龐大，一般不采用。聲明塊格式的丟失最易導致錯誤。當浮動元素無法承載子元素的時候，子元素會在下一行顯示。浮動元素的無法合并。 CSS的個人理解一、概念層疊樣式表，主要由屬性和屬性值（value）組成。（雖然HTML、CSS對代碼大小寫不敏感，但是屬性和屬性值對代碼大小寫是...

Rango 2019-08-30 14:16 評論0 收藏0
編碼規范-css.md

摘要：單行規則聲明只包含一條聲明的樣式，為了易讀性和便于快速編輯，建議將語句放在同一行。命名名稱中只能出現小寫字符和破折號不是下劃線，也不是駝峰命名法。設置文件編碼為。其他參考網址編碼規范的優先級機制瀏覽器加載，解析，渲染標簽寫在前面對于不同的編程語言來說，具體的編碼規范各不相同，但是其宗旨都是一致的，就是保證代碼在高質量完成需求的同時具備良好的可讀性、可維護性。本文大部分內容來自網...

ARGUS 2019-08-29 13:06 評論0 收藏0
CSS編碼規范

摘要：代碼風格文件建議文件使用無的編碼。解釋編碼具有更廣泛的適應性。示例空格強制選擇器與之間必須包含空格。示例字號強制需要在平臺顯示的中文內容，其字號應不小于。示例響應式強制不得單獨編排，必須與相關的規則一起定義。轉載：原地址 1 前言 CSS作為網頁樣式的描述語言，在百度一直有著廣泛的應用。本文檔的目標是使CSS代碼風格保持一致，容易被理解和被維護。雖然本文檔是針對CSS設計的，...

flyer_dev 2019-08-28 18:04 評論0 收藏0
代碼質量管理——如何寫出優雅地代碼

摘要：高內聚不應該將沒有任何聯系的東西堆到一起。高內聚是值得要的，因為它意味著類可以更好地執行一項工作。高內聚有助于緩解高耦合，高耦合是需要高內聚的標志。對于開發者來說，高內聚通常比低耦合更有幫助，盡管兩者通常可以一起完成。作為一個剛寫代碼不久的小菜鳥，工作的半年多讓我越發意識到提高代碼質量的重要性。從前只會關注實現功能，慢慢的開始關注性能，現階段則發現其實還有很多細節也是（如可讀性、易用...

Miracle_lihb 2019-08-30 14:01 評論0 收藏0