Question

我刚开始使用sass / scss，我遇到了一个小问题。我们假设这段代码：

.button {
  color:#c00;
  &:hover {
    color:#000;
  }
}

一切都很棒，并按照预期的方式运作。但是..让我们说我想根据标签做不同的徘徊。因此，如果标记为span以显示颜色，并且标记为a以显示其他颜色。

这可能不重复选择器的某些部分吗？

谢谢！

Answer 1

没有。请记住，最终所有内容都编译为CSS。

这样做的方法如下：

.button {
  .green {
    color:green;
    &:hover { color:black; }
  }
  .red {
    color:red;
    &:hover { color:black; }
  }
}

你需要添加一个类。

你可以使用mixin方法，但它会更加冗长。

Answer 2

我会这样做：

.button {
  color: red;
  &:hover { color: black; }
}

span.button:hover { color: green; }

a.button:hover { color: blue; }