【less】注释、变量

【1、注释】

在less中，注释的方法有2中。
一种是双斜杠（//）
另一种是（/ /）

在CSS中，只认（/ /），而双斜杠（//）CSS是不认的。
所以在less中，用（/ /）的注释是可以被编译出来的。
而双斜杠（//）在less的编译过程中，是忽略掉的。

less代码

// 双斜杠注释

/* 传统样式注释 */

编译后的CSS代码

/* 传统样式注释 */

---

【变量】

less变量的声明是用 @ 符。引用的时候也是用 @ 符。

@后面跟着变量名，然后加上冒号，再加上变量的值。

@变量名: 值

less

@bgc: #ff6600;
@area: 1200px;

body {
  background-color: @bgc;
}
.content {
  width: @area;
}

编译后的CSS

body {
  background-color: #ff6600;
}
 .content {
  width: 1200px;
}

通常会用less设置一个主题色、版心的常用属性。

日后需要修改，只要修改定义好的变量就行。变量能大大减少日后维护的工作量。