現在bootstrap也有官方sass版本用了一段時間bootstraplesssass沒有實踐過,大概看了下文檔,中文SASS文檔看了下compass,源碼很久沒更新了,感覺很多功能bootstrapmixins有類似的另外發現一個extend的區別lesstocss//less.text-left{text-align:left;}.text-right{text-align:right;}.important{&:extend(.text-left);&:extend(.text-right);}.mm{.text-left{color:#ff0;}}.text-left,.important{text-align:left}.text-right,.important{text-align:right}.mm.text-left{color:#ff0}scsstocss//scss.text-left{text-align:left;}.text-right{text-align:right;}.important{@extend.text-left;@extend.text-right;}.mm{.text-left{color:#ff0;}}.text-left,.important{text-align:left;}.text-right,.important{text-align:right;}.mm.text-left,.mm.important{color:#ff0;}sass會生成.mm.important這個預期不想要的選擇器sass在合并選擇器時似乎會生成多余的選擇器,而less就不會bootstrap源碼.btn-group-xs>.btn{@extend.btn-xs;}sass版本的最終會生成.navbar-btn.btn-xs,.btn-group-xs>.navbar-btn.btn{margin-top:14px;margin-bottom:14px;}而less的只是.navbar-btn.btn-xs{margin-top:14px;margin-bottom:14px;}另外less也可以不用extend直接.important{.text-left;.text-right;}像.clearfix這種包含偽類的還是得用extend避免生成多余選擇器不考慮rubyonrails和sass的語法簡潔特性webstormemmet時.scss自動換行.sass不換bourbon和lesshat這些文檔還沒看,求討論下sassless如何選擇?
sass 和less選擇問題
明月笑刀無情
2019-04-08 11:19:25