less
less的一些提升效率的技巧
1、导入外部文件
在文件中导入外部less文件的方法:
@import “static/css/layout.less”;
可以直接使用导入外部文件定义的变量
2、变量
@color:#fff;
.nav{
background-color:@color;
}
3、混入(多重继承)
3.1、不带参数
.currentCover(){
background-color:blue;
}
a:hover{
.currentCover();
}
3.2、带参数
.currentCover(@color;@type){
background-color:@color;
display:@type;
}
a:hover{
.currentCover(blue;block);
}
4、命名空间防止多人开发时重名问题
5、继承
.currentCover{
background-color:blue;
}
a:hover{
&:extend(.currentCover);
}
6、嵌套
#uploadBody{
.uploadImage{
p{
}
.hide{
display:none;
}
}
.uploadVideo{
.uploadImage > .hide;
}
}
年前再来转转!
honey,how are you
It’s not bad