each遍历

$colors: (
      #00D477,
      #F57933,
      #0052F5
    );

  @each $c in $colors {
    $i: index($colors, $c);

    .tag-#{$i} {
      background-color: $c;
    }
  }

生成的结果如下:

.tag-1 {
  background-color: #00D477;
}

.tag-2 {
  background-color: #F57933;
}

.tag-3 {
  background-color: #0052F5;
}

for循环

$colors: (
    #00D477,
    #F57933,
    #0052F5
);

@for $i from 1 to 4 {
    .tag-#{$i} {
        background-color: nth($colors, $i)
    }
}

生成结果与上方一样,要注意的是to循环不到4
另外to换成through,但是后者可以走到4


明未为洺
68 声望2 粉丝

引用和评论

0 条评论