css - 带有整数和小数的 Sass 控制指令 @for

Question

我想将整数和小数作为后缀添加到 CSS 类选择器中，并将该值作为百分比传递。

例如:

.percentage-100 的 width 为 100% - 这可行。

.percentage-50.5 的宽度 width 为 50.5% - 这是行不通的。

也就是说，我的 Sass 控制指令尊重整数并分配值而不是小数。

我可以利用 Sass 专家的一些见解来了解这个公式目前的问题，

@for $i from 0 through 100 {
    .percentage-#{$i} {
        &:after {
            $value: ($i * 1%);
            width: $value;
        }
    }
}

再次感谢您的宝贵时间。

Answer 1

第二个示例将不起作用，因为点 .percentage-50.5 链接了两个类:.percentage-50 和 .5。

其次，类不能以数字开头，因此 .5 是无效的类名。有关有效类名的更多信息 here .点不能用于表示任何类中的十进制值。您应该用下划线或连字符替换第二个点。