我可以使用SASS / SCSS变量来设置类名吗？

Question

我试图为网格布局创建一堆列，并想知道我是否可以使用SASS / SCSS mixin自动进行宽度计算。

我正在写作

@mixin setWidth($a, $b){
 width : ($a / $b)*100%;
}
.col-1-2{
 @include setWidth(1, 2);
}

那很好，但我只是想知道是否有办法让它更干，通过设置一个变量名的类并用mixin创建类。

像

这样的东西

@mixin setClass($a, $b){
  .col-$a-$b{
    width : ($a / $b)*100%;
  }
}

@include setClass(1, 2);

Answer 1

在将变量#{$a}用于命名约定时，您只需要插入变量@mixin setClass($a, $b){ .col-#{$a}-#{$b} { width : ($a / $b)*100%; } } @include setClass(1, 2);

{{1}}

示例：http://sassmeister.com/gist/8634660fa4b32f50b4c1