相关疑难解决方法(0)

我正在尝试进行一个设置,将一个类从1增加到12,并根据变量列表(也是12个变量)设置背景颜色.

我很接近,但没有得到我所希望的.这是我第一次涉足SASS的控制指令,所以请原谅我的无知.

目前,我正在成功增加课程.这是选择我错过的增量变量的一部分.

@mixin colors {
        $colors: $orange, $blue, $lightBlue, $teal, $lightTeal, $green, $lightGreen, $darkOrange, $orange, $lightOrange, $yellow, $lightYellow;
        @each $color in $colors {
            background-color:#{$color};
        }       
    }

@for $i from 1 through 12 { 
    .block-#{$i} {
        span {
            @include colors;
        }
    }
}

这输出类似于:

.block-10 span {
    background-color: #faa21b;
    background-color: #005ca8;
    background-color: #0079c3;
    background-color: #0088a8;
    background-color: #009386;
    background-color: #00a05e;
    background-color: #589c45;
    background-color: #d4772b;
    background-color: #faa21b;
    background-color: #f7971f;
    background-color: #f9cc2a;
    background-color: #f6ee32;
}

理想情况下,我想要一个背景颜色声明,而不是12.我认为这可能是一些简单的我不知道.任何见解将不胜感激!