less编译

less用法

1.注释

//这个注释无法被解析

2.变量

@aa:20px;
@bb:1px solid red;
@cc:blues;

3.嵌套

/*传参的用法*/
.box(@cc){
  color:@ccc;
  width:@aaa;
  border:@bbb;
}
.box2{
  .box(30px);
}

4.混入

传统写法

.layout{}
.layout div{}
.layout div a{}

less写法

.layout{
  >div{
    color:red;
    a{
      text-align:center;
    }
  }
  >div::nth-child(2){
    color:pink;
  }
}

5.导入

@import "b.less"导入另一个b.less文件。可以使用b.less变量，样式或者函数。