SCSS插值传递数值失效求助：@for循环mixin传参问题

API 探路者

2026-7-24

问题分析与修复方案

你的SCSS代码存在两处关键语法错误，导致无法正常运行，以下是问题说明和修复后的代码：

错误点说明

@for循环的数值插值误用：在@for $i from #{$start} through #{$end}中，你对$start和$end使用了插值语法#{}，这会将传入的数字参数转换为字符串类型，而SCSS的@for循环要求起始/结束值必须是数值类型，直接导致循环无法执行。
缺少语句结束分号：最后一行@include titleTxt("text", 16, 24)末尾没有分号，这是SCSS的语法错误，会触发编译失败。
（可选优化）：$colors作为SCSS Map，键名不需要加单引号，去掉引号更符合常规写法（带引号也能运行，但冗余）。

修复后的完整代码

$colors: (primary: #000, secondary: #fff);

@mixin titleTxt($title, $start, $end) {
  @for $i from $start through $end {
    @if $i % 2 == 0 {
      .#{$title}-#{$i} {
        color: #000;

        @each $name, $color in $colors {
          &-#{$name} {
            color: $color;
          }
        }
      }
    }
  }
}

@include titleTxt("text", 16, 24);