Loops 使用循环生成变量(“复杂语句的较短/友好命名别名”问题)

Loops 使用循环生成变量(“复杂语句的较短/友好命名别名”问题),loops,less,Loops,Less,我知道在较少的情况下,可以使用生成许多CSS类。我个人用这个技巧来回答另一个问题 现在我面对的是以下代码: @transparent-black-10: fade(@nero, 0.1); @transparent-black-20: fade(@nero, 0.2); @transparent-black-30: fade(@nero, 0.3); @transparent-black-40: fade(@nero, 0.4); @transparent-black-50: fade(@ner

我知道在较少的情况下,可以使用生成许多CSS类。我个人用这个技巧来回答另一个问题

现在我面对的是以下代码:

@transparent-black-10: fade(@nero, 0.1);
@transparent-black-20: fade(@nero, 0.2);
@transparent-black-30: fade(@nero, 0.3);
@transparent-black-40: fade(@nero, 0.4);
@transparent-black-50: fade(@nero, 0.5);
@transparent-black-60: fade(@nero, 0.6);
@transparent-black-70: fade(@nero, 0.7);
@transparent-black-80: fade(@nero, 0.8);
@transparent-black-90: fade(@nero, 0.9);

@transparent-white-10: fade(@bianco, 0.1);
@transparent-white-20: fade(@bianco, 0.2);
@transparent-white-30: fade(@bianco, 0.3);
@transparent-white-40: fade(@bianco, 0.4);
@transparent-white-50: fade(@bianco, 0.5);
@transparent-white-60: fade(@bianco, 0.6);
@transparent-white-70: fade(@bianco, 0.7);
@transparent-white-80: fade(@bianco, 0.8);
@transparent-white-90: fade(@bianco, 0.9);
我想知道是否有可能使用循环生成像上面那样更少的变量,或者这被语言拒绝了。如果可能的话,您是否有更有效地生成上述代码的建议?

(现在,v3.x及更高版本的版本提供了对自定义函数的本机支持)

与大多数其他编程语言一样,这个编程问题不是自动生成/预定义变量的列表,而是通过
函数
功能来解决的。
也就是说,您定义了如下函数:

.transparent-black(@value) {
    return: fade(@nero, @value ./ 10);
}
然后,您只需使用
.transparent black(*)[]
函数调用,而不是
@transparent black-*
变量,例如:

div {
    color: .transparent-black(50)[];
}

这显然是一个简化的例子(在一个实际项目中,我当然会将
black/white/etc
作为函数参数)。

至少,在变量中生成后缀非常困难(几乎不可能)。@Harry:对不起,我不确定是否正确理解了。你是说不可能用一个循环生成这个吗?我只能使用这个特性压缩变量名?并没有办法动态地“生成”变量(我想永远也不会)。如果我正确理解了您的目标,在传统语言中,这个用例通常是通过函数来解决的,例如,不创建变量的banch(至少说起来很奇怪),只需定义
透明白色(值)
函数即可。但是Less也没有功能,所以你要么保持原样,要么从头开始重新思考。(好吧,如果不知道用例的更多细节,很难提出任何建议……在一个简单的情况下,为什么不定义
@white:@bianco;
并使用
淡入(@white,0.9)
?毕竟,
淡入(@white,0.9);
@transparent-white-90
)之间没有语义上的区别。@LucaDetomi:很抱歉不清楚,我是在电话里输入评论,所以它太短了。是的,总的来说,我觉得这几乎是不可能的,至少在变量中生成后缀数字(10、20等)是很困难的。谢谢你,但似乎正确的函数应该是
return:fade(@black,@value),因为在
颜色的情况下:。透明黑色(50)[],带有代码结果
颜色:rgba(0,0,0,0.05)我错了吗?