each循环

@each 循环就是去遍历一个列表，然后从列表中取出对应的值。

@each 循环指令的形式： @each $var in < list >

在下面的例子中你可以看到，$var 就是一个变量名，< list > 是一个 SassScript 表达式，他将返回一个列表值。变量 $var 会在列表中做遍历，并且遍历出与 $var 对应的样式块。

这有一个 @each 指令的简单示例：

 @each $animal in puma, egret, salamander {
  .#{$animal}-icon {
    background-image: url('img/#{$animal}.png');
  }
}

被编译为：

.puma-icon {
  background-image: url('img/puma.png'); }
.egret-icon {
  background-image: url('img/egret.png'); }
.salamander-icon {
  background-image: url('img/salamander.png'); }