說(shuō)一說(shuō)樣式優(yōu)先級(jí)的規(guī)則是什么?
得分點(diǎn):!important、行內(nèi)樣式、嵌入樣式、外鏈樣式、id選擇器、類選擇器、標(biāo)簽選擇器、復(fù)合選擇器、通配符選擇器、繼承樣式。
回答:CSS樣式的優(yōu)先級(jí)可以分為五大類。
????第一類!important,無(wú)論以何種方式引入,何種選擇器,它的優(yōu)先級(jí)都是最高的。
????第二類引入方式,行內(nèi)樣式的優(yōu)先級(jí)要高于嵌入和外鏈,若嵌入和外鏈?zhǔn)褂玫倪x擇器相同就看它們?cè)陧?yè)面中插入的順序,后面插入的覆蓋前面的。
????第三類選擇器,選擇器的優(yōu)先級(jí)為id選擇器 >(類選擇器 | 偽類選擇器 | 屬性選擇器)>(后代選擇器 | 偽元素選擇器)>(子選擇器 | 相鄰選擇器)> 通配符選擇器。
????第四類繼承樣式,是所有樣式中優(yōu)先級(jí)比較低的。
????第五類瀏覽器默認(rèn)樣式,優(yōu)先級(jí)最低。
加分回答:使用!important要謹(jǐn)慎,一定要優(yōu)先考慮使用樣式規(guī)則的優(yōu)先級(jí)來(lái)解決問(wèn)題而不是!important。
????只有在需要覆蓋全站或外部CSS的特定頁(yè)面中使用!important。
????永遠(yuǎn)不要在你的插件中使用!important。
????永遠(yuǎn)不要在全站范圍的CSS代碼中使用!important。
????優(yōu)先級(jí)的比較指的是相同的樣式屬性,不同樣式屬性優(yōu)先級(jí)比較失效。比如:在設(shè)置max-width時(shí)注意,已經(jīng)給元素的max-width設(shè)置了!important但是還不生效,很有可能就是被width覆蓋了。
????舉例:div最終的寬度還是200px 。