為什麼要有預處理css?less.js的工作原理： 是內部先用ajax請求less檔案(遍歷網頁上的具有rel=stylesheet/less屬性的檔案)，然後按照自己的語法解析，生成對應的css然後加在頁面中。css寫起來比較費事，而且**難以維護 , 後來，就有了讓css加入一些程式設計的元素，像其他程式語言一樣可以做一些預定的處理，這就是 css預處理器( css preprocessor )
注意事項：
1. 先引入我們自己編寫的less檔案
2. 再引入我們的less.js檔案
3. 但是我們在生產環境下，我們引入頁面的是css,而非less檔案，因為如果讓css在瀏覽器端編譯，那麼會使瀏覽器端響應變慢，這種是不可取的，所以我們都是編寫好less檔案後，在本地編譯成css檔案，最後引入頁面。
下面來看下less的一些基礎的東西
在less 中也可以有注釋，分為單行注釋，和多行注釋。
// 單行注釋 ,注 less 在編譯過程中會忽略掉。/*!
* 也可不用嘆號，嘆號的作用，不會再壓縮的時候被去除。用於宣告版權。
*/
@containerwidth:1200px;
// 正確的巢狀和&用法
.con}}
}}// 正確使用 &
.box
// p 是 .box 是後面的兄弟元素
& + p
// div 是 .box 的後代 div
div}
// 錯誤的使用&
.box
}}
// 定義乙個類
.roundedcorners(@radius:5px;)
// 應用乙個類
#header
#footer
// 在主less檔案中 匯入其他三個less檔案， 舉例如下：
@import
url('_other1.less');
@import
url('_other2.less');
@import
url('_other3.less');
自動編譯less為css
1.安裝 命令 npm install gulp less 或者 cnpm install gulp less 2.編寫檔案 獲取gulp var gulp require gulp 獲取gulp less模組 var less require gulp less 編譯less 在命令列輸入gulp...
nodejs 批量編譯less 檔案為css
我們在用less時，有時會有很多less塊，乙個乙個手動編譯很麻煩，使用下面的 可以一次性遞迴編譯 在專案less檔案目錄，新建個js檔案。貼上 如下 var fs require fs path require path exec require child process exec,source...
gulp學習之四 編譯 LESS
npm install gulp less 獲取 gulp var gulp require gulp 獲取 gulp less 模組 var less require gulp less 編譯less 在命令列輸入 gulp less 啟動此任務 gulp.task less function 在...