less 笔记
1、less的注释有两种,一是/***/会被编译到css中,二是//不会被编译到css中
2、声明变量:@变量名:值;
3、混合变量:在less中重新声明一个类,在另一个类中直接调用这个类(.class{.class1}),这样class这个类中就会有class1中的声明块
4、混合变量可以传参数:
(1).class(@变量名){} 调用的时候直接.class1{.class(值)}
(2).class(@变量名:值){}
5、匹配模式:.class(名字,@变量名:值){} 调用的时候直接.class1{.class(名字)}
PS:@_(是class携带的声明,后面的@变量名:值也要写上):.class(@_,@变量名:值)
6、@变量名:值
里面的值可以进行运算,比如像素,颜色的+ - * /
7、嵌套规则
![](https://images.cnblogs.com/OutliningIndicators/ContractedBlock.gif)
.ul-class{ //样式 li{ //样式 a{ //样式 } span{ //样式 } } }
而且:a{}和a:hover{}可以直接写成a{ &:hover{}}
&指的是上一层选择器
8、@arguments变量
比如:.class(@变量名:值,@变量名:值,@变量名:值){border:@arguments}
9、避免编译
.class {width:~'cale(300px-20px)'}