css屬性值的層疊衝突規則

2022-06-09 22:12:18 字數 312 閱讀 3381

層疊衝突:同乙個樣式,多次用到同乙個元素,就會發生層疊衝突,需要對樣式表有衝突的申明使用層疊規則,確定css屬性值

color: #000000 !important;
總體規則:選擇器選中的範圍越窄,越特殊

具體規則:通過選擇器,計算出乙個4位數(****),數值越大,屬性值的優先順序越高

千位:若果是內聯樣式,記1,否則記0

百位:等於選擇器中所有id選擇器的數量

十位:等於選擇器中所有類選擇器,偽類選擇器,屬性選擇器的數量

各位:等於選擇器中元素選擇器,偽元素選擇器的數量

css層疊規則

網頁上的元素其實是三維的,類似於高中學的左手座標系,z軸就是垂直於螢幕。層疊上下文跟 塊狀格式化上下文 bfc 類似,只要元素擁有某些特定的css屬性,就會表現出層疊上下文的特點。前提是重疊在一起,就會按照上圖的規則呈現。1 誰大誰上 如生效的z index屬性值,大的就覆蓋小的。2 後來居上 當元...

css 樣式層疊規則

檢視別人css,發現有一段css button.dark.blue button.dark 如果這樣寫,backgroud color到底是用誰的呢?原來我只知道內聯樣式的權值 id選擇器 類選擇器 標籤選擇器這樣的規則,還有就是越精細等級越高,看上面css 應該是第乙個優先順序更高吧 測試了一下,...

css層疊性規則

在css中,會根據選擇器的特殊性來決定所定義的樣式規則的次序,具有更特殊選擇器的規則優先於具有一般選擇器的規則。各種選擇器的特殊值 1 內聯樣式的特殊值 1 0 0 0 2 id選擇器的特殊值為 0 1 0 0 3 類選擇器 屬性選擇器 偽類的特殊值為 0 0 1 0 4 元素選擇器 偽元素的特殊值...