平时得业务需求中大家肯定遇到过很多个标签然后展示不同得颜色得,单独写类名或者选取第几个child这种肯定不如写个循环方便。跟js写循环差不多步骤。
1.先定义一个值列表比如说:
2.定义完毕之后就可以直接写循环了
3.代码如下:
$colors: (
1: #3698fd,
2: #1bc3bb,
3: #faa500,
4: #b37feb,
5: #ef4c5d,
);
@each $key, $color in $colors {
&:nth-child(#{$key}) {
color: $color;
}
}