我的 SASS 循环使用插值和百分比中断

Question

This code is breaking my SASS process for some reason..

@for $i from 1 through 100 {
  .t-#{$i} {
    top: #{$i}%;
  }
} 

Answer 1

You can change to this:

@for $i from 1 through 100 {
  .t-#{$i} {
    top: 1% * $i
  }
}

From SASS docs :

Here is an example

Answer 2

You can also write like this

@for $i from 1 through 100 {
  .t-#{$i} {
    top: #{$i + '%'};
  }
}