1. 定義:
使用 @ 符號來定義變量 ,在Less中開頭是 @ 則是變量,關於變量的命名方法,大家可以參考js中命名的規則,畢竟是做前端的,有着統一的習慣有助於我們統一風格。個人推薦變量名的命名規則使用駝峰命名法。第一個單詞首寫字母小寫,從第二個開始,單詞首寫字母大寫。如boxAaa,boxBbbb,boxContainer,……,當然也是可是使用香腸命名法用下划線“_”來命名。如,box_main,border_bottom,……
2. 使用:
在樣式屬性值中使用時,直接用 @variable 即可調用變量;
在其他地方,包括選擇器名稱、屬性名稱、URL和@import語句使用時,變量必須以插值的形式使用,例如:
@variable: 200px; //定義變量作為樣式屬性值使用 @classname: .nav_a; //變量值不可用中划線,此變量作為插值用於選擇器名稱 @{classname}{ //作為插值 必須加 {} width: @variable; //作為屬性值直接調用 }
輸出:
.nav_a { width: 200px; }