1.動態樣式語言
CSS：靜態樣式語言，作爲一門語言並不稱職！缺少一般語言必需的基本要素：變量、運算、循環/選擇、函數等，導致了CSS代碼的修改和維護非常麻煩。
動態樣式語言：在CSS的基礎之上，添加了動態語言所必需的元素，如變量、運算、循環/選擇、函數等，方便樣式文件的修改和維護。
注意：瀏覽器默認只能處理靜態樣式語言，所有的動態樣式語言必需設法轉換爲CSS才能被瀏覽器所理解！這個轉換操作稱爲“編譯”。
常見的動態樣式語言：
(1)Sass/SCSS
(2)Stylus
(3)Less
3.Less的使用
是一種 動態 樣式 語言.
LESS 爲 CSS 賦予了動態語言的特性，如 變量， 繼承， 運算， 函數。 LESS 既可以在 客戶端 上運行 (支持IE 6+, Webkit, Firefox)，也可以藉助Node.js或者Rhino在服務端運行。
(1)運行方式1：在客戶端運行Less轉換程序——瞭解
在HTML中引入xx.less，同時再引入一個less.js——就是一個可以運行在客戶端瀏覽器中的less編譯程序——效率太低，不推薦使用。
(2)運行方式2：在服務器端運行Less轉換程序——推薦
步驟：
1)下載並安裝一款服務器端的JS解釋器——NodeJS或者Rhino
2)下載less文件的轉換程序（lessc-Compiler）——一個JS腳本
3)在服務器端JS解釋器中運行lessc轉換器，把自己編寫的.less文件轉換爲.css文件
a)方式1：可以在命令行中使用轉換程序
node.exe lessc my.less my.css
b)方式2：可以在WebStorm中使用轉換程序
4)繼續編寫HTML文件，引用編譯得到的.css文件即可。
4.Less語法學習
(1)Less完全支持CSS的所有語法
(2)Less支持單行和多行註釋，但只有多行註釋會被轉換到css文件中
(3)Less支持變量(Variable)
語法：@變量名: 值;
使用：.class { 樣式： @變量名; }
(4)Less支持樣式混合(Mixin)——在一個樣式中混入另一個樣式
語法： .class1{ ... }
.class2{
...
.class1;
...
}
(5)帶參混合
語法： .class1(@參數1, @參數2, ...){ ... }
.class2{
...
.class1(值1， 值2, ...);
...
}
(6)嵌套規則
語法：.class1 {
....
.class2 { ... }
}
轉換的結果： .class1 { ... }
.class1 .class2 { ... }
(7)Less可以對變量、常量進行算術運算
語法： 變量/值 +-*/ 變量/值
(8)Less爲樣式提供了幾十個應用函數
lighten(顏色，亮度值)：將指定的顏色變亮指定的百分比
darken(顏色，亮度值)：將指定的顏色變暗指定的百分比
floor(數字)：對數值進行下取整
ceil(數字)：對數值進行上取整
(9)頁面導入
儘量避免使用CSS文件中的@import指令——會增加HTTP請求次數；
爲了可以將一個樣式文件拆分爲多個小的樣式文件，由多人同時編寫，可以使用LESS中的@import——less中導入其他less文件，轉換時會拼接爲一個大的完整的CSS樣式文件，故推薦在Less中@import其他的Less文件。
語法： @import "xx.less";
@import "yy";
================示例：大型項目中的less文件結構=============
variables.less 放置所有的變量
mixin.less 放置所有的混合
reset.less 放置HTML元素重置樣式
navbar.less 導航條相關樣式
footer.less 頁腳相關樣式
....
jd.less => jd.css 總樣式文件 一大堆@import
=================================================
5.通過修改Bootstrap的Less源文件實現樣式定製
定製的目標：
(1)刪除不需要的樣式，如輪播廣告、模態框...
在bootstrap.less文件中，註釋掉不需要的@import即可。
(2)定製需要的組件的默認樣式，如修改導航條的默認背景色
修改variables.less文件中的變量即可。
(3)在Bootstrap提供的默認樣式基礎上創建新樣式，如定製dropdown中的divider的樣式——組件的深度定製
修改某個組件所對應的.less文件