Less是什么
Less类似于jQuery。
——是一种css动态语言，属于css预处理语言的一种。它使用类似css的语法，为css赋予动态语言的特性，如变量、继承、函数、运算等，更方便css的维护与编写。
注释
/**/ ：编译时保留，编译后的css文件中也能看到注释
//：编译时忽略，编译后的css文件中看不到
定义变量
用符号@来定义变量
- 例
定义：
@width:300px;
使用：
.box{width:@width;}
混合
编写可重用样式
例：
.border{
border:solid 5px #fff;
}
.box{
.border;
margin:10px;
}
带参数的混合
例：
.border(@border_width){
border:solid @border_width #fff;
}
.test{
.border(30px);
}
带默认值的混合
例：
.border(@border_width:30px){
border:solid @border_width #fff;
}
.test{
.border();/*不报错，默认传入30px,若传入参数，则参数覆盖默认值*/
}
匹配模式
例：
.position(r){
position:relative;/*相对定位*/
}
.position(a){
position:absolute;/*绝对定位*/
}
.position(f){
position:fixed;/*静止*/
}
.test{
.postion(a);/*使用绝对定位*/
}
运算
@width:300px;
.box{width:@width+20px;}
嵌套
例：
li{
a{
color:#ff0000;
&:hover{#color:#0000ff;}/*&代表它的上一层选择器*/
}
span:{color:#00ff00}
}
相当于：
li a{color:#ff0000;}
li a:hover{color:#0000ff;}
li span{color:#00ff00}
@arguments变量
@arguments包含了传进来的所有参数。
例：
.test_border(@color:#fff,@so:solid,@width:30px){
border:@arguments;
}
避免编译
语法：~''
