Less的模式匹配
Less的模式匹配
Less提供了一种机制,允许根据参数的值来改变 mixin的行为。比如,以下代码就可以让 .mixin 根据不同的 @switch 值而表现各异:
.mixin (dark, @color) {color: darken(@color, 10%);}.mixin (light, @color) {color: lighten(@color, 10%);}
此时,在调用 .mixin 时:如果 @switch 设为 light,就会得到浅色;如果 @switch 设为 dark,就会得到深色。如,以下调用:
@switch: light;.class1 {.mixin(@switch, #888);}@switch2 : dark;.class2 {.mixin(@switch, #666);}
编译后的CSS代码为:
.class1 {color: #a2a2a2;}.class2 {color: #808080;}

浙公网安备 33010602011771号