現(xiàn)在bootstrap也有官方sass版本用了一段時(shí)間bootstraplesssass沒(méi)有實(shí)踐過(guò),大概看了下文檔,中文SASS文檔看了下compass,源碼很久沒(méi)更新了,感覺(jué)很多功能bootstrapmixins有類(lèi)似的另外發(fā)現(xiàn)一個(gè)extend的區(qū)別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會(huì)生成.mm.important這個(gè)預(yù)期不想要的選擇器sass在合并選擇器時(shí)似乎會(huì)生成多余的選擇器,而less就不會(huì)bootstrap源碼.btn-group-xs>.btn{@extend.btn-xs;}sass版本的最終會(huì)生成.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這種包含偽類(lèi)的還是得用extend避免生成多余選擇器不考慮rubyonrails和sass的語(yǔ)法簡(jiǎn)潔特性webstormemmet時(shí).scss自動(dòng)換行.sass不換bourbon和lesshat這些文檔還沒(méi)看,求討論下sassless如何選擇?
sass 和less選擇問(wèn)題
明月笑刀無(wú)情
2019-04-08 11:19:25