如何在 sass 中修改根父选择器 [重复]答案

【问题标题】：How to modify the root parent selector in sass [duplicate]如何在 sass 中修改根父选择器 [重复]
【发布时间】：2014-06-07 11:13:21
【问题描述】：

如何修改父选择器链的根元素？（使用 sass 3.3.x）类似...

=prepend($prefix)
  @at-root .#{$prefix}#{&}   // note there is no dot (.) separating it
    @content

.foo
  .bar
    +prepend(baz)
      background: red

然后返回

.baz.foo .bar {
  background: red;
}

或者甚至更好...一种针对根元素（甚至第 n 个元素）的显式方式？

【问题讨论】：

这里有同样的问题。似乎 SASS 只支持更简单的用例，即用另一个类包装当前选择器的内容，ala stackoverflow.com/questions/19563128。这对于在更大的规则集中内联浏览器或设备特定的覆盖非常方便。

标签： sass

【解决方案1】：

=prepend($prefix)
  &.#{$prefix}
    @content

.foo
  +prepend("baz")
    .bar
      background: red

返回这个：

.foo.baz .bar {
  background: red;
}

走在正确的轨道上？

【讨论】：

我希望能够在树中的任何位置添加到根目录。仅当直接从要添加的父级使用 mixin 时，此解决方案才有效。
@brewster 那么在什么条件下会触发不同的结果呢？您的期望的更多示例会有所帮助。