Question

虽然 LESS是预处理器，但我该怎么做

@ltr: ltr;
@rtl: rtl;
@dir: @rtl;

.SetTypeFaceVariables when (@dir = @ltr) {
    @headType: 'Segoe UI_';
}
.SetTypeFaceVariables when (@dir = @rtl) {
    @headType: Tahoma;
}

.SetTypeFaceVariables();  // Error is here, we cannot call Mixins here like this

h1{
   font-family: @headType;
}

如何在不同方向定义 @headType 变量？

感谢@ seven-phases-max，您可以找到 Demo on Codepen

Answer 1

正如在评论中已经提到的那样，您的示例可以使用Less 1.5.0及更高版本进行编译。很可能你的IDE附带了一些过时版本的Less编译器（1.4.2？1.3.3？）。没关系，你只需要一个小小的修复就可以使代码与古老的Less版本兼容（低至1.3.2）：

@ltr: ltr;
@rtl: rtl;
@dir: @ltr;

// the magic is in parens:
.SetTypeFaceVariables() when (@dir = @ltr) {
    @headType: 'Segoe UI_';
}
.SetTypeFaceVariables() when (@dir = @rtl) {
    @headType: Tahoma;
}

.SetTypeFaceVariables(); 

h1 {
   font-family: @headType;
}

如何在CSS类之外调用LESS Mixins？

1 个答案: