0

Bourbon Neat グリッド ミックスインを使用して、グリッド用の BS のようなクラスを作成しようとしています。私のコードは次のようになります。

@each $num in 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12 {
  .span#{$num} {
    @include span-columns(#{$num});
  }
}

私がしたいことはこれです：

.span1 {
  @include span-columns(1);
}

.span2 {
  @include span-columns(2);
}

//...

Grunt ビルド ログは次のように言っています。

Syntax error: Undefined operation: "1 times 4.2358em".
    on line 9 of bower_components/neat/app/assets/stylesheets/grid/_private.scss, in `span-columns'
    from line 25 of app/sass/main.scss

私が理解できないのは、$num から mixin に値を渡すことができない理由です。

4

1 に答える 1

0

ケースに合わせてドキュメントから変更された例。@forまた、 の代わりにループを使用しましたが、 を使用する@eachこともできます@each。問題は、変数を文字列として渡すことで、文字列に対して数学演算が行われるため#{}、変数から を削除する必要があります。

$class-slug: span !default;

@for $i from 1 through 12 {
    .#{$class-slug}#{$i} {
        @include span-column($i);
    }
}

編集: SassMeister でこの要点を試してください。

于 2014-06-29T11:37:50.663 に答える