css - Sass Mixin Modulo 无法正常工作

Question

我想编写一个 sass mixin，它从 1 到 100 每 5 步输出一个特定的类。但我无法让模运算符以某种方式工作。根本没有创建任何类。

这是我的代码

@mixin flex_percentage($className) {
    @for $i from 1 through 100 {
        @if $i % 5 != 0 {
            .#{$className}#{$i} {
                width: $i * 1%;    
            }
        }
    }
}
@include flex_percentage(p);

我也试过 $i mod(5) 但它输出了所有 100 个类。

我想要这样的输出

.p5 {
    width: 5%;
}
.p10 {
    width: 10%;
}
.p15 {
    width: 15%;
}

Answer 1

@if $i % 5 != 0 { 应该是这样的:

@if $i % 5 == 0 {

区别在于 != 和 == 中的 if 子句。您的原始代码实际上是输出每个类 那些是 5 的倍数的类。如果我们将其更改为 ==，则仅输出那些是 5 的倍数的类。

实例:http://sassmeister.com/gist/7550271