循环使用scss中的变量来创建类？

Question

这只是一个尝试学习scss ::

的练习

问题：

如何在scss中创建一个for循环，根据14个scss变量创建14个类？

---

我在scss中有一个变量列表：

// golden ratio ^n
$hue-1: $hue-main + (360 * 0.979);
$hue-2: $hue-main + (360 * 0.965);
$hue-3: $hue-main + (360 * 0.944);
$hue-4: $hue-main + (360 * 0.910);
$hue-5: $hue-main + (360 * 0.854);
$hue-6: $hue-main + (360 * 0.764);
$hue-7: $hue-main + (360 * 0.618);
$hue-8: $hue-main + (360 * 0.382);
$hue-9: $hue-main + (360 * 0.236);
$hue-10: $hue-main + (360 * 0.146);
$hue-11: $hue-main + (360 * 0.090);
$hue-12: $hue-main + (360 * 0.056);
$hue-13: $hue-main + (360 * 0.034);
$hue-14: $hue-main + (360 * 0.021);

我有1个循环，我想生成14个类？

@for $i from 1 through 14{
  .hue#{$i} {
     hsl($hue-#{$i}, 50%, 50%);    
  }
}