注:本文為翻譯文章,因翻譯水平有限,難免有缺漏不足之處,可查看原文。

  我們知道寫css代碼是非常枯燥的,尤其是寫重復(fù)顏色、樣式的代碼,這需要我們付出很多努力來保持css代碼可維護(hù),但是它本不應(yīng)該是這樣的。

  很幸運(yùn)地是,web開發(fā)社區(qū)已經(jīng)解決了這個(gè)問題,我們?cè)诂F(xiàn)在已經(jīng)有了類似與less、sass和stylus這樣的預(yù)處理器。它們有很多優(yōu)于一般的css之處,如下所示:

  • 變量---以至于我們可以在樣式表中定義和輕松地改變值。

  • 動(dòng)態(tài)計(jì)算值。在css中我們有calc。

  • Mixins---使得我們重用和結(jié)合樣式。它甚至還支持傳遞參數(shù)。

  • 函數(shù)---它給我們大量方便的功能來操作顏色、轉(zhuǎn)換圖片等等。

  不足之處在于如果你使用他們其中的一種預(yù)編譯器,你需要把它編譯成普通的css這樣他才能在你的瀏覽器中工作。

 

第一部分:Getting Started

  Less 它需要Node.js或者一個(gè)web 瀏覽器來運(yùn)行。你也可以在你的站點(diǎn)引用less.js,這樣它就可以實(shí)時(shí)地編譯所有的.less樣式表,但是這是很慢的,并且我們不推薦。推薦的方式是提前編譯你的less樣式表成為.css文件來使用。有很多免費(fèi)的地方可以幫你編譯less文件,但是在這篇文章中我將使用node.js。

網(wǎng)友評(píng)論