【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设置一个主题色、版心的常用属性。

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

    原文作者:Rabbit_svip
    原文地址: https://www.jianshu.com/p/4a16b404c8d9
    本文转自网络文章,转载此文章仅为分享知识,如有侵权,请联系博主进行删除。
点赞