Css Sass循环输出字符串而不是数字

我想做一个循环，创建8个不同的类，它们具有相同的include，但值不同。这是我的密码：

@for $i from 1 through 8 {
  $baseDelay: 0.4;
  .fade-in-#{$i} {
    @include animationDelay(#{$baseDelay}+((#{$i}-1)/2)s);
  }
}

我应该将此作为第一个类的输出：

.fade-in-1 {
  -webkit-animation-delay: 0.9s;
  animation-delay: 0.9s;
}  

但我得到的却是第一个输出：

.fade-in-1 {
  -webkit-animation-delay: 0.4+(1-0.5) s;
  animation-delay: 0.4+(1-0.5) s;
}

---

有人能帮我吗？我认为这个问题是因为Sass认为总和中的某些东西是刺痛。

您可以使用此代码

这就是我的混血儿的样子

@mixin animationDelay($var) {
  -webkit-animation-delay: $var;
  animation-delay: $var;
}

@for $i from 1 through 8 {
  $baseDelay: 0.4;
  .fade-in-#{$i} {
    @include animationDelay( ($baseDelay + ($i - 1)/2) + s); 
    // I did the calculation first before adding the s for seconds
  }
}

这就是我的for循环的样子

@mixin animationDelay($var) {
  -webkit-animation-delay: $var;
  animation-delay: $var;
}

@for $i from 1 through 8 {
  $baseDelay: 0.4;
  .fade-in-#{$i} {
    @include animationDelay( ($baseDelay + ($i - 1)/2) + s); 
    // I did the calculation first before adding the s for seconds
  }
}

结果如下

.fade-in-1 {
  -webkit-animation-delay: 0.4s;
  animation-delay: 0.4s; }

.fade-in-2 {
  -webkit-animation-delay: 0.9s;
  animation-delay: 0.9s; }

.fade-in-3 {
  -webkit-animation-delay: 1.4s;
  animation-delay: 1.4s; }

 .fade-in-4 {
  -webkit-animation-delay: 1.9s;
  animation-delay: 1.9s; }

 .fade-in-5 {
  -webkit-animation-delay: 2.4s;
  animation-delay: 2.4s; }

 .fade-in-6 {
  -webkit-animation-delay: 2.9s;
  animation-delay: 2.9s; }

 .fade-in-7 {
  -webkit-animation-delay: 3.4s;
  animation-delay: 3.4s; }

 .fade-in-8 {
  -webkit-animation-delay: 3.9s;
  animation-delay: 3.9s; }