是否有用于"is descendant or has class"的 sass/css 选择器？

Question

我想

选择一个元素，如果它有类.eventContainer并且有一个类.todo的父元素，或者如果它有类.grid和.todo：

.todo .eventContainer,
.grid.todo
    background-color: gray

有没有办法通过嵌套来避免两次指定.todo类？

Answer 1

如注释中所述，您可以使用 & 运算符(请参阅官方文档(在嵌套规则中插入父选择器，如下所示：

.todo
  & .eventContainer,
  &.grid
    background-color: gray

这将编译为：

.todo .eventContainer,
.todo.grid {
  background-color: gray;
}