SCSS：当父母添加一个班级时修改孩子的财产

Question

使用SCSS，我想知道是否有更优雅的方法（使用&）基于父级添加特定类来修改子级。

我发现的唯一方法是：CSS - modify parent based on first child

这是有效的方法（基于上面的答案）：

.parent {
  .child  {
    opacity: 0.5;
  }
}
.parent.certain-class {
  .child  {
    opacity: 1.0;
  }
}

我想做的是这样的：

.parent {
  .child  {
    opacity: 0.5;

    collapsed& {
      opacity: 1.0;
    }
  }
}

在SCSS中有什么方法可以实现这一点？

Answer 1

是的，有一种方法可以在scss中完成。 使用＆后跟没有空格的类名。 请查看下面的示例。

.parent {
  .child  {
    opacity: 0.5;
  }

&.certain-class {
  .child  {
    opacity: 1.0;
  }

}