有没有办法使用＆amp;与父选择器在同一行？

Question

我要做的是将相同的样式应用于按钮的默认状态以及其聚焦状态。这样的事情，但实际造型不止一行：

.my-button {
    color: red;
    &:focus: {
        color: red;
    }
}

为了避免复制样式，我希望我能写出类似的内容：

.my-button, &:focus {
    color: red;
}

但当然不是&的工作方式。有没有办法做到这一点？

我知道我可以写.my-button, .my-button:focus { ... }。我只是想了解Sass是否可以做到这一点。

Answer 1

您可以单独使用父选择器&, &:focus：

.my-button {
    &, &:focus {
        color: red;
    }
}