課程
/前端開發
/Sass/Less
/Sass和Compass必備技能之Sass篇
.error.instruction 這種形式在html中是怎么用的?
2016-01-24
源自:Sass和Compass必備技能之Sass篇 4-1
正在回答
這個問題我也遇到了,專門研究了一下
CSS中這樣寫表示定義的是兩個類的交集樣式
在html中也是添加多個類名并列(試了一下,順序還可以互換)的調用方式
此時權重會發生改變, ?.class1和.class2的權重是1,而.class1.class2的權重為2(即最高),頁面加載時會優先使用權重高的,即自己定義的交集樣式,而不是.class2的樣式
顯示效果:
-----------------------------------------------------------------------------------------------------------------
對比以下另一種情況,理解會更深刻
假設CSS不定義交集樣式.class1.class2,看看是什么情況
html調用過程相同
此時 ?.calss1和.calss2的權重是1,.class2寫在后面會覆蓋掉.class1的樣式
----------------------------------------------------------------------------------------------------------
總結,這種類選擇器交集的寫法適合特定的應用場景,比如同時滿足class1和class2的元素時候又不想定義第三種類的時候(還有就是ie6不支持兩個連續并列class類名),我也沒有實踐過這種寫法,感覺不好理解(可能我沒碰到適合這樣的應用場景),我一般寫下面這種寫法,比較益于理解,可擴展和可維護性也高。
舉報
Sass與Compass初體驗,初戀即深戀,助您寫出更優秀的CSS
1 回答這里scss編譯成css是實時的?怎么實現的?
1 回答我習慣用window的怎么辦?
1 回答在scss文件里寫了但是在css里面沒有生成對應的樣式
1 回答output_style=:compressed怎么不起作用?
1 回答老師使用的是工具是什么?是sublime嗎
Copyright ? 2025 imooc.com All Rights Reserved | 京ICP備12003892號-11 京公網安備11010802030151號
購課補貼聯系客服咨詢優惠詳情
慕課網APP您的移動學習伙伴
掃描二維碼關注慕課網微信公眾號
2016-01-26
這個問題我也遇到了,專門研究了一下
CSS中這樣寫表示定義的是兩個類的交集樣式
在html中也是添加多個類名并列(試了一下,順序還可以互換)的調用方式
此時權重會發生改變, ?.class1和.class2的權重是1,而.class1.class2的權重為2(即最高),頁面加載時會優先使用權重高的,即自己定義的交集樣式,而不是.class2的樣式
顯示效果:
-----------------------------------------------------------------------------------------------------------------
對比以下另一種情況,理解會更深刻
假設CSS不定義交集樣式.class1.class2,看看是什么情況
html調用過程相同
此時 ?.calss1和.calss2的權重是1,.class2寫在后面會覆蓋掉.class1的樣式
顯示效果:
----------------------------------------------------------------------------------------------------------
總結,這種類選擇器交集的寫法適合特定的應用場景,比如同時滿足class1和class2的元素時候又不想定義第三種類的時候(還有就是ie6不支持兩個連續并列class類名),我也沒有實踐過這種寫法,感覺不好理解(可能我沒碰到適合這樣的應用場景),我一般寫下面這種寫法,比較益于理解,可擴展和可維護性也高。