1

当主体上有特定的类时，我试图覆盖变量的值。我希望能够根据我添加到正文的此类更改为不同的“主题”。

我的原色的默认变量

$primary: #6cc907;

覆盖主变量

.branded {
  $primary: #e43e94;
}
4

1 回答 1

2

考虑mixin为此应用程序使用 a 而不是变量。在您的选择器中，您可以包含mixin并传递一个变量。您甚至可以为mixin变量设置默认值，在本例中是您的 base background-color。mixin通过传递一个新值来覆盖它。

萨斯

@mixin bg-color($primary: #6cc907) {
  background-color: $primary;
}

div {
  @include bg-color(); // Use default value

  display: inline-block;
  height: 300px;
  width: 200px;

  &.branded {
    @include bg-color(#e43e94); // Override value
  }
}

代码笔示例

于 2013-09-26T22:43:37.960 回答