@each?循環(huán)絕對(duì)是Sass提供的三個(gè)循環(huán)方式中最常用的。它提供了一個(gè)簡潔的 API 來迭代列表或 map。

@each $theme in $themes {
  .section-#{$theme} {
    background-color: map-get($colors, $theme);
  }
}

當(dāng)?shù)粋€(gè) map 時(shí)，通常使用?$key?和?$value?作為變量名稱來確保一致性。

@each $key, $value in $map {
  .section-#{$key} {
    background-color: $value;
  }
}

同時(shí)遵守下述規(guī)則，確?？勺x性：

• each?前添加空行；
• 除非下一行是右閉大括號(hào)（}），否則在所有右閉大括號(hào)（}）后面添加新行。