摘要:實(shí)際上是誰(shuí)在文件中,權(quán)重相等,聲明在后面,那么最終就應(yīng)用誰(shuí)解釋上面的說(shuō)明大致意思就是,如果兩個(gè)選擇器的聲明權(quán)重相等,那么誰(shuí)在后面,最后就應(yīng)用誰(shuí)。
上代碼
.yellow { background: yellow; } .red { background: red; }這個(gè)區(qū)域渲染出來(lái)是什么顏色呢?紅色? 黃色?
答案是紅色
不知道有多少人和我有一樣的誤區(qū),一直以為是由class中的排版順序決定同優(yōu)先級(jí)樣式應(yīng)用順序的。。。
實(shí)際上是誰(shuí)在css文件中,權(quán)重相等,聲明在后面,那么最終就應(yīng)用誰(shuí)
解釋W3C 上面的說(shuō)明
https://www.w3.org/TR/CSS2/cascade.html#cascading-orderFinally, sort by order specified: if two declarations have the same weight, origin and specificity, the latter specified wins. Declarations in imported style sheets are considered to be before any declarations in the style sheet itself.
大致意思就是,如果兩個(gè)選擇器的聲明權(quán)重相等,那么誰(shuí)在后面,最后就應(yīng)用誰(shuí)。
文章版權(quán)歸作者所有,未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請(qǐng)注明本文地址:http://systransis.cn/yun/112905.html
相關(guān)文章
CSS學(xué)習(xí)摘要-層疊和繼承
摘要:類選擇器具有更高的專用性,所以將戰(zhàn)勝元素選擇器。個(gè)位在整個(gè)選擇器中每包含一個(gè)元素選擇器或偽元素就在該列中加分。選擇器六明顯地輸給了了五,其專用性值為和它在鏈中少了一個(gè)元素選擇器。當(dāng)有多個(gè)選擇器作用在一個(gè)元素上時(shí),哪個(gè)規(guī)則最終會(huì)應(yīng)用到元素上? 其實(shí)這是通過(guò)層疊機(jī)制來(lái)控制的,這也和樣式繼承(元素從其父元素那里獲得屬性值)有關(guān)。 元素的最終樣式可以在多個(gè)地方定義,它們以復(fù)雜的形式相互影響。這些復(fù)雜...
利用javascript獲取并修改偽元素的值
摘要:利用方法選擇到偽元素,然后利用方法獲取對(duì)應(yīng)的屬性的值。具體用法可以參考的這篇文章而偽元素的屬性值除了常規(guī)賦值外,還有一種特殊的方法來(lái)獲取。具體實(shí)現(xiàn)參照,不再做具體分析參考文獻(xiàn)獲取元素值之方法熟悉 雖然標(biāo)題里寫的是偽元素,不過(guò)這篇文章主要是說(shuō)::before和::after,其余幾個(gè)偽元素(::first-letter、::first-line、::selection等)由于沒(méi)有cont...
Vue:scoped與module的使用與利弊
摘要:一個(gè)應(yīng)用是離不開(kāi)與,其中充斥的整個(gè)項(xiàng)目中。下面我會(huì)分別對(duì)與解決方案進(jìn)行說(shuō)明,最后在分析它們的利弊與選擇。不過(guò)一個(gè)子組件的根節(jié)點(diǎn)會(huì)同時(shí)受其父組件有作用域的和子組件有作用域的的影響。但它的局限性是適用于中小項(xiàng)目中。 showImg(https://segmentfault.com/img/bVbnIPd?w=900&h=383); 一個(gè)web應(yīng)用是離不開(kāi)html、css與js,其中css充...
Vue:scoped與module的使用與利弊
摘要:一個(gè)應(yīng)用是離不開(kāi)與,其中充斥的整個(gè)項(xiàng)目中。下面我會(huì)分別對(duì)與解決方案進(jìn)行說(shuō)明,最后在分析它們的利弊與選擇。不過(guò)一個(gè)子組件的根節(jié)點(diǎn)會(huì)同時(shí)受其父組件有作用域的和子組件有作用域的的影響。但它的局限性是適用于中小項(xiàng)目中。 showImg(https://segmentfault.com/img/bVbnIPd?w=900&h=383); 一個(gè)web應(yīng)用是離不開(kāi)html、css與js,其中css充...
Vue:scoped與module的使用與利弊
摘要:一個(gè)應(yīng)用是離不開(kāi)與,其中充斥的整個(gè)項(xiàng)目中。下面我會(huì)分別對(duì)與解決方案進(jìn)行說(shuō)明,最后在分析它們的利弊與選擇。不過(guò)一個(gè)子組件的根節(jié)點(diǎn)會(huì)同時(shí)受其父組件有作用域的和子組件有作用域的的影響。但它的局限性是適用于中小項(xiàng)目中。 showImg(https://segmentfault.com/img/bVbnIPd?w=900&h=383); 一個(gè)web應(yīng)用是離不開(kāi)html、css與js,其中css充...
發(fā)表評(píng)論
0條評(píng)論
閱讀 2797·2021-09-23 11:44
閱讀 1684·2021-09-13 10:24
閱讀 2634·2021-09-08 09:36
閱讀 1241·2019-08-30 15:54
閱讀 2262·2019-08-30 13:54
閱讀 3323·2019-08-30 10:57
閱讀 1859·2019-08-29 18:43
閱讀 3627·2019-08-29 15:10