创建一个mixin并在同一个SASS循环中使用它

时间:2018-01-15 16:45:56

标签: css sass

我有一个SASS循环,可以生成'实用程序'设计师以8px / .5 rem。

的增量工作时,边距为top的样式类

我决定在这里提高我的SASS技能并创建一个循环来输出它作为类:

@for $i from 1 through 12 {
    .mt-#{$i} {
        margin-top: #{(($i * 8) / 16)}rem;
    }
}

但是,我还想同时创建一个mixin,以便我可以直接在标记中使用该类,或者通过@include包含它。

我试过了:

@for $i from 1 through 12 {
    @mixin margin-top-#{$i} {
        margin-top: #{(($i * 8) / 16)}rem;
    }
    .mt-#{$i} {
        @include margin-top-#{$i}();
    }
}

这给了我一个mixin声明行的语法错误。这可能吗?或者我应该只看两个循环,因为它会输出相同的?

0 个答案:

没有答案