less

注释

/* 注释 */ : 会编译

// ： 不会被编译

变量

定义变量规则 @变量名:值；

@baseColor: #e92322
    a{
        color:@baseColor;
    }

混入

可以将一个定义好的样式引入到另外一个样式中，类似于函数的调用

比如给一个元素加圆角，这就需要处理兼容

.addRadius(@r:10px){ // 设置默认值10px,如果没有传入就显示10px
    border-radius: @r;
    -webkit-border-radius:@r;
    -moz-border-radius:@r;
}
div{
    width:200px;
    height:200px;
    // 传入参数
    .addRadius(@r);
}

嵌套

可以实现选择器的继承，减少代码量，同时使代码结构更加清晰。

.jd_header{
    width:100%;
    height:200px;
    // 加圆角
    .addRadius();
    div{
        width:100%;
    }
}