LESS
LESS:
Less 是一门 CSS 预处理语言,它扩展了 CSS 语言,增加了变量 Mixin、函数等特性,使 CSS 更 易 维护和扩展(Less 可以运行在Node 或浏览器端)。
less可以在多种语言、环境中使用,包括浏览器端、桌面客户端、服务端。
ess 的 &代表连接符的意思
Less的模式有混合模式和 匹配模式
混合模式:
. border(){ border:1px solid red; }
. border(@width){ border:@width solid red; }
.border(@width:1px) { border:@width solid red;} //如果不带参数,那么这里将默认为1px
匹配模式:
.float(left){ float:left; }
.float(right){float:right;}
调用匹配模式:那么就是:.setFloat{ .float(left); } 或者 .setFloat{ .float(right); }
匹配模式:相当于JS中的if但又不完全是,缅族条件后才能匹配。
LESS中的注释:
1.可以使用css中的注释(/**/)
2.可以用//注释
.//编译时会自动过滤掉
less中声明变量的话使用@开头
LESS中的运算:
任何数字、严肃或者变量都可以参与运算,运算应该被包裹在括号中。
例:+ - * /
Less中嵌套:
两种用法:
.&对尾类的使用: -hover或focus
.对连接的使用:.&-item