資訊專欄INFORMATION COLUMN
摘要：選擇器的權重第一種情況樣式表中只有單一樣式即內聯元素第二種情況組合選擇器從左往右逐個比較，按進行比較越大權重越高。
css選擇器的權重
1第一種情況：
樣式表中只有單一樣式：
即 內聯>id>class>元素
#id{} .class{} p{}
2第二種情況：
組合選擇器
從左往右逐個比較，按a,b,c,d 進行比較 越大權重越高。
權限值生成方法
按權重由高到低書寫,不按選擇器的順序寫
eg:
/*bbc */
#dii .dd #ip{
color: palevioletred;
}
/*bcc */
#dii .dd .cp{
color: paleturquoise
}
/*bbb */
#dii>#idd>#ip{
color: yellowgreen;
}
這個里面權重順序 bbb>bbc>bcc
3 單個和組合混淆
eg:
/*bcc */
#dii .dd .cp{
color: paleturquoise
}
/*bbc */
#dii .dd #ip{
color: palevioletred;
}
/*bbb */
#dii>#idd>#ip{
color: yellowgreen;
}
-------------------------------------
單個
/*b */
#ip{
color: cyan;
}
權重順序 bbb>bbc>bcc>b
總結：
權重值從左往右逐個比較，如第一個位置與另一組的第一個比較，有大小權重關系就不在比較后面的，如相等 繼續比較后面的，如果是比較的組合一個有值另一個沒值，有值權重更高。
文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。
轉載請注明本文地址：http://m.specialneedsforspecialkids.com/yun/115712.html
摘要：優先級是由權重來作為衡量標準的，權重的計算有一套計算公式，有如下規范使用一個位數的字串來表示級別，從左到右，左邊的做大，往右依次遞減，且數位之間沒有進制，級別之間不可逾越。定義了一個命令，該命令被賦予最大的優先級。一、背景 CSS有三大特性：層疊性、繼承性、優先級。 而我們在給CSS定義樣式的時候，經常出現兩個及以上的規則應用在同一元素上，單該元素最終在瀏覽器呈現的效果是應用的哪個規則呢？這...
摘要：樣式選擇器權重優先級如下的權重為選擇器的權重為類選擇器的權重為偽類選擇器的權重為屬性選擇器的權重為標簽選擇器的權重為偽元素選擇器的權重為通配符的權重為綜合上述權重優先級來看，正確的優先級排序應該是內聯樣式類偽類屬性選擇標簽偽元素繼承通配符 CSS選擇器是編寫CSS代碼時的一個核心概念，選擇器定義了相應的樣式將會影響到文檔中的哪些部分，以下是自己在學習及工作過程中對CSS選擇器的一些總結...
摘要：我們會在組合選擇器中來了解為什么權重值要加連字符。組合選擇器中的權重值會分別對不同類型的選擇器進行計數。對比兩組選擇器，第二組選擇器有兩個選擇器，擁有更高的權重值。 CSS是一門復雜的語言，擁有相當的大能力。 它我們允許為頁面添加布局和設計，允許多個元素甚至多個頁面共享樣式。在我們有能力解鎖所有功能之前，我們必須先充分理解它的基礎點。 首先，我們要明確的了解樣式是怎么被渲染的。 具體的...
摘要：我們會在組合選擇器中來了解為什么權重值要加連字符。組合選擇器中的權重值會分別對不同類型的選擇器進行計數。對比兩組選擇器，第二組選擇器有兩個選擇器，擁有更高的權重值。 CSS是一門復雜的語言，擁有相當的大能力。 它我們允許為頁面添加布局和設計，允許多個元素甚至多個頁面共享樣式。在我們有能力解鎖所有功能之前，我們必須先充分理解它的基礎點。 首先，我們要明確的了解樣式是怎么被渲染的。 具體的...
摘要：前端雜談權重權重想必大家都聽說過一些簡單的規則大部分人也都知道較長的權重會大于較短的權重高于但是具體規范是什么瀏覽器是按照什么標準來判定不同選擇器的權重的呢讓我們來看一下官方文檔是怎么說的第一個關鍵詞官方文檔中用特異性來表示一個和其元素的相 前端雜談: CSS 權重 (Specificity) css 權重想必大家都聽說過, 一些簡單的規則大部分人也都知道: 較長的 css sele...
閱讀 1090·2021-11-19 09:40
閱讀 2229·2021-11-15 18:00
閱讀 1278·2021-10-18 13:34
閱讀 2260·2021-09-02 15:40
閱讀 1545·2019-08-30 14:01
閱讀 1123·2019-08-30 11:11
閱讀 2489·2019-08-29 15:26
閱讀 735·2019-08-29 14:15
