// example @selectors: blue, green, red; each(@selectors, { .sel-@{value} { a: b; } }) // outputs .sel-blue { a: b; } .sel-green { a: b; } .sel-red { a: b; } ===================================== // example @colors: { info: #eee; danger: #f00; } each(@colors, { .text-@{key} { color: @value } }) //outputs .text-info { color: #eee; } .text-danger { color: #f00; }
@value, @key, @index三个变量，对大部分的列表而言， @key和 @index会被定义为相同的值（比如以1开始的有序列表）。然而，你也可以使用规则自定义列表中的@key值each()函数中你不必都使用@value, @key, @index作为变量名。在Less 3.7版本中，因为each()函数， Less被描述为可以接受匿名不定参数，这一特性将会扩展到其他的语法中#()或者 .()的样式为开头// example .set-2() { one: blue; two: green; three: red; } .set-2 { // Call mixin and iterate each rule each(.set-2(), .(@v, @k, @i) { @{k}-@{i}: @v; }); } // outputs .set-2 { one-1: blue; two-2: green; three-3: red; }
// example $colors: ( info: #eee; danger: #f00; ) @each $colorKey, $color in $colors{ .text-#{$colorKey} { color: @color } } //outputs .text-info { color: #eee; } .text-danger { color: #f00; }
原文：https://www.cnblogs.com/galaxy2490781718/p/13256236.html