less基本使用
定义变量
@ly_width:100px; .box { width:@ly_width; }
混合
// 不带参混合 @ly_width:100px; @ly_height:200px; @ly_color:green; .border { border:1px solid red; } .one { width:@ly_width; height:@ly_height; background-color:@ly_color; .border; } // 带参混合 @ly_width:100px; @ly_height:200px; @ly_color:green; .border(@border_width) { border:@border_width solid red; } .one { width:@ly_width; height:@ly_height; background-color:@ly_color; .border(1px); }
匹配模式
.border(left;@border_width:5px;@border_color:red){ border-left:@border_width solid @border_color; } .border(@_,@border_width:5px;@border_color:red){ border-color:yellow; } .border_use1 { //选择和if差不多 如果是left就调用上面对应的 .border(left); }
运算
@ly_width:100px; .one { width:@ly_widht + 100; }
嵌套
@arguments变量
.border(@border_width;@border_style;@border_color){ border:@arguments; } .one { .border(1px;solid;red); }
相关推荐
前端 2020-08-03
骷髅狗 2020-08-02
wghou 2020-06-21
wghou 2020-06-16
覆雪蓝枫 2020-06-16
骷髅狗 2020-06-14
骷髅狗 2020-06-12
sixyearsorless 2020-05-27
zhanghaibing00 2020-05-27
maiktom 2020-05-26
比格杰森 2020-05-26
e度空间 2020-05-17
maiktom 2020-05-11
buttonChan 2020-05-10
Enjoyendless 2020-05-08
sixyearsorless 2020-05-07
骷髅狗 2020-04-24