当另一个变量为true时，LESS CSS定义变量。

Question

当另一个变量为true时，LESS CSS定义变量。

4

我曾经在CSS中使用守卫表达式来实现LESS中的IF语句，然而当我试图像下面这样声明变量时，它们对我无效...

@neutral: false;
@warm: true;

when (@neutral = true) {
    @green: #91C95B;
    @red: #F15647;
    etc...
}
when (@warm = true) {
    @green: #91AD3C;
    @red: #BF2A23;
    etc...
}

这是一个我希望能够使用该变量的示例。

h1 {
    color:@green;
}

这是我预期它编译成CSS的方式。

h1 {
    color: #91AD3C;
}

这是否可以通过LESS实现，还是需要修改代码使用mixin guards？

- Smegger

1个回答

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- Joffrey Maheo · Accepted Answer

您可以这样使用Guarded Mixins:

@neutral: false;
@warm: true;

.color() when (@neutral) {
    @green: #91C95B;
}
.color() when (@warm) {
    @green: #91AD3C;
}
.color();


h1 {
    color:@green;
}