作者 Werner Schuster 譯者 楊晨 發(fā)布于 2009年7月28日 上午5時(shí)56分
在Web開發(fā)中,CSS的使用是非常普遍的,但濫用的情況也是屢見不鮮。 LESS 和 Sass 都是用Ruby實(shí)現(xiàn)的工具,可以幫助開發(fā)者寫出復(fù)用性更優(yōu)的CSS文件。它們的方法基本類似: 將類似CSS但是更為強(qiáng)大的輸入語言,最終轉(zhuǎn)換為CSS代碼。
兩種語言給CSS添加的特性都是相似的,具體參見 LESS 和 Sass 的文檔。下面是一個(gè)簡(jiǎn)略的概述:
- 變量 : LESS中的 @name 和Sass中的 !name 都是變量。我們可以給變量賦值,然后在文件中使用它們。
- 內(nèi)嵌 :這個(gè)功能將另外一個(gè)急需的特性加入CSS:將選擇器嵌入到其他等級(jí),而不是不得不取消在一些高級(jí)選擇器定義中嵌套。LESS和Sass翻譯器將這個(gè)簡(jiǎn)潔的特性擴(kuò)展到了CSS。
- 混合類型 :允許開發(fā)者抽象出性質(zhì)的共同點(diǎn),然后命名并且加入到選擇器中。熟悉Ruby混合類型的開發(fā)者會(huì)了解混合類型在CSS中的應(yīng)用。Sass也允許將混合類型作為參數(shù),使得混合類型的應(yīng)用更加靈活。
- 操作 :LESS和Sass都支持簡(jiǎn)單的算術(shù)操作,例如加法。將這個(gè)特性和變量結(jié)合起來,會(huì)使得CSS變得更加靈活。這兩個(gè)工具需要保證操作的正確性(例如字體大小)。
Sass 是由 Haml 的團(tuán)隊(duì)開發(fā)的。它采用了Haml的思想,使用縮進(jìn)而不是括號(hào)這樣的分隔符來定義代碼塊或者內(nèi)嵌級(jí)別。
Sass的解析器 和翻譯器將Sass語言翻譯成CSS,并且用變量值替換文件中變量的引用以及混合類型等等。
LESS 是受Sass啟發(fā)而開發(fā)的工具,它列出了 如下開發(fā)的理由 :
為什么要開發(fā)一個(gè)Sass的替代品呢?原因很簡(jiǎn)單:首先是語法。Sass的一個(gè)關(guān)鍵特性是縮進(jìn)式的語法,這種語法可以產(chǎn)生柱式外觀的代碼。但是你需要花費(fèi)時(shí)間學(xué)習(xí)一門新的語法以及重新構(gòu)建你現(xiàn)在的樣式表。
LESS給CSS帶來了很多特性,使得LESS能夠和CSS無縫地緊密結(jié)合在一起。因此,你可以平滑地由CSS遷移到LESS,如果你只是對(duì)使用變量或者操作感興趣的話,你不需要學(xué)習(xí)一整門全新的語言。
LESS的解析器是使用 TreeTop 編寫的,TreeTop是一個(gè)Ruby編寫的PEG解析器的生成器( LESS TreeTop語法 )。
LESS和Sass工具(編譯器和API)能夠作為Gems安裝,使用命令行工具進(jìn)行編譯,但是也可以在Ruby代碼中使用。
Sass看起來在提供的特性上占有優(yōu)勢(shì),但是LESS能夠讓開發(fā)者平滑地從現(xiàn)存CSS文件過渡到LESS,而不需要像Sass那樣需要將CSS文件轉(zhuǎn)換成Sass格式。Sass的維護(hù)者Nathan Weizenbaum在一篇 對(duì)比LESS和Sass的博文 中提到,未來Sass將會(huì)提供括號(hào),而不是像CSS或者LESS那樣的縮進(jìn)。
查看英文原文: DRYer CSS with LESS or Sass
更多文章、技術(shù)交流、商務(wù)合作、聯(lián)系博主
微信掃碼或搜索:z360901061

微信掃一掃加我為好友
QQ號(hào)聯(lián)系: 360901061
您的支持是博主寫作最大的動(dòng)力,如果您喜歡我的文章,感覺我的文章對(duì)您有幫助,請(qǐng)用微信掃描下面二維碼支持博主2元、5元、10元、20元等您想捐的金額吧,狠狠點(diǎn)擊下面給點(diǎn)支持吧,站長(zhǎng)非常感激您!手機(jī)微信長(zhǎng)按不能支付解決辦法:請(qǐng)將微信支付二維碼保存到相冊(cè),切換到微信,然后點(diǎn)擊微信右上角掃一掃功能,選擇支付二維碼完成支付。
【本文對(duì)您有幫助就好】元
