? 一. Sass&Less是什么?
Less (Leaner Style Sheets 的縮寫) 是一門向后兼容的 CSS 擴展語言。因為 Less 和 CSS 非常像康愤,Less 僅對 CSS 語言增加了少許方便的擴展半开,學習很容易。?
sass枢冤,作為”世界上最成熟鸠姨、最穩(wěn)定、最強大的專業(yè)級CSS擴展語言”掏导。兼容所有版本的css享怀,且有無數框架使用sass構建,如Compass趟咆,Bourbon添瓷,和Susy。
使用方法:參考官方文檔
?相同之處:
? ? ? ? ? ?Less和Sass在語法上有些共性值纱,比如下面這些:
? ? ? ? ? ?1鳞贷、混入(Mixins)——class中的class;
? ? ? ? ? ? 2虐唠、參數混入——可以傳遞參數的class搀愧,就像函數一樣;
? ? ? ? ? ? 3疆偿、嵌套規(guī)則——Class中嵌套class咱筛,從而減少重復的代碼;
? ? ? ? ? ? 4杆故、運算——CSS中用上數學迅箩;
? ? ? ? ? ? 5、顏色功能——可以編輯顏色处铛;
? ? ? ? ? ? 6饲趋、名字空間(namespace)——分組樣式,從而可以被調用撤蟆;
? ? ? ? ? ? 7奕塑、作用域——局部修改樣式;
? ? ? ? ? ? 8家肯、JavaScript 賦值——在CSS中使用JavaScript表達式賦值龄砰。
兩者異同:
? ? ? ? ? ??
1、Less在JS上運行讨衣,Sass在Ruby上使用寝贡。
Sass基于Ruby扒披,需要安裝Ruby。Less和Sass在Ruby中構建相似圃泡,但它已被移植到JavaScript中碟案。為了使用LESS,我們可以將適用的JavaScript文件上載到服務器或通過脫機編譯器編譯CSS表颇蜡。
2价说、編寫變量的方式不同。
Sass使用$风秤,而Less使用@鳖目。
3、在Less中缤弦,僅允許循環(huán)數值领迈。
在Sass中,我們可以遍歷任何類型的數據碍沐。但在Less中狸捅,我們只能使用遞歸函數循環(huán)數值。
4累提、Sass有Compass尘喝,Less有Preboot
Sass和LESS有可用于集成mixins的擴展(在整個站點中存儲和共享CSS聲明的能力)。
Sass有適用于mixins的Compass斋陪,其中包括所有可用的選項以及未來支持的更新朽褪。
LESS有Preboot.less,LESS Mixins无虚,LESS Elements缔赠,gs和Frameless。LESS的軟件支持比Sass更加分散友题,導致許多不同的擴展選項可能不會以相同的方式運行橡淑。對于項目,我們可能需要所有列出的擴展以獲得與Compass類似的性能咆爽。