如何使用scss为元素声明两个类

Question

我有这个scss代码：

button.green{
  background-color: $green;
  .current {
    color: $white;
  }
}

我想将两个类应用于我的按钮<button class="green current"></button>，但我的scss代码不起作用。你会如何以适当的scss方式解决这个问题？

还试过没有运气：

button {
  .green{
    background-color: $green;
  }
  & .current {
    color: $white;
  }
}

Answer 1

几乎正确，在你的嵌套中缺少“＆”以连接button.green和.current。

你的scss的css输出是：

button.green > .current

意思是，在其父“button.green”中设置元素“current”。

正确：

button.green{
  background-color: $green;
  &.current {
    color: $white;
  }
}

哪个输出：

button.green.current

Answer 2

.green.current {
     background-color: $green;
     color: $white;
}

这将适用于两个类!!