我想减少字体大小甚至颜色(带循环?)。 LESSCSS有可能吗?我尝试了以下它并且它可以工作,但它每次只减少1的字体大小 - 原因很明显。还有另一种方法吗?
目前:
@iterations: 6;
h(@index) when (@index > 0) {
(~"h@{index}") {
font-size: 21px - @index;
}
h(@index - 1);
}
h(0) {}
h(@iterations);
给了我这个:
h6 { font-size:15px; }
h5 { font-size:16px; }
h4 { font-size:17px; }
h3 { font-size:18px; }
h2 { font-size:19px; }
h1 { font-size:20px; }
但这并不是我所追求的。我希望“h”减少1 - 它目前正在减少 - 而字体大小减少 - 让我们说 - 每个循环5px。
任何想法?
答案 0 :(得分:3)
你已经有了困难的部分。您可以使用*
乘以LESS。因此,您可以根据需要调整循环。举个例子:
@iterations: 6;
h(@index) when (@index > 0) {
(~"h@{index}") {
font-size: 40px - @index*5;
}
h(@index - 1);
}
h(0) {}
h(@iterations);
编译为:
h6 { font-size:10px; }
h5 { font-size:15px; }
h4 { font-size:20px; }
h3 { font-size:25px; }
h2 { font-size:30px; }
h1 { font-size:35px; }