Question

这是超级基本的

$span1Width:  10;
$marginWidth:  5;


@mixin span-width($spannr) {
      width: $span1Width   * $spannr *1%;
      *width: $marginWidth* $spannr -1 *1%;
}


div{
  @use span-width(10);
}

在使用codepen进行分析css时导致“空规则”。

Answer 1

如果您查看sass文档中有关如何使用mixins的示例，您可以看到：

$color: white;
@mixin colors($color: blue) {
  background-color: $color;
  @content;
  border-color: $color;
}

.colors {
  @include colors { color: $color; }
}

所以你应该使用@include和{}代替。喜欢（在本例中使用默认值5）：

$span1Width:  10;
$marginWidth:  5;


@mixin span-width($spannr: 5) {
      width: $span1Width   * $spannr *1%;
      *width: $marginWidth* $spannr -1 *1%;
}


div{
  @include span-width{ spannr: 10};
}

这应该会给你正确的结果

新的scss，“规则是空的”？

1 个答案: