SCSS 循环干扰变换：旋转

Question

我正在尝试使用 scss 制作动画，但我遇到了这个循环的问题。我正在尝试将 8 个对象每个旋转 45 度。当我输入：

@for $i from 1 through 8 
  #no#{$i}
    transform: rotate(45*$ideg)

它破坏了编译器，因为它认为变量是 $ideg。但是 deg 需要与转换的数字相对应。当我在两者之间放置 space 时，它不起作用。想法？

Answer 1

您可以像使用 id 选择器一样对其进行插值：

@for $i from 1 through 8 
  #no#{$i}
    transform: rotate(#{45*$i}deg)

SCSS loop interfering with transform: rotate