使用 & 号 (SCSS) 定位直接父级答案

【问题标题】：Target immediate parent with ampersand (SCSS)使用 & 号 (SCSS) 定位直接父级
【发布时间】：2015-07-15 19:37:24
【问题描述】：

我在 scss 中遇到了我认为奇怪的行为。

我有一个嵌套 2 层深的类，我试图用 & 号定位直接父级，但它却以父级的父级为目标。

.one {
      .two{
        .three & {
          background:red;
          //should be .one .three .two right?
          //instead targets .three .one .two
        }
      }
    }

以下是 codepen http://codepen.io/gpspake/pen/KpeEXp 上此行为的示例

【问题讨论】：

把它放在最后真是令人困惑。
这是一个错误报告（提示：SO 不适用于错误报告）还是您有技术问题？预期的结果是 .three .one .two，因为 & 代表当前嵌套级别之前的整个已解析选择器。
@DanielA.White 这似乎是在很多examples 中找到的& 符号的常见用法。实际上，我经常使用它。奇怪的是，在这种情况下，它针对的是根父级而不是直接父级。
@cimmanon 不谢谢。这有点清楚了。那么如何从嵌套类中定位直接父级，或者这是不可能的？
瞄准它做什么？

标签： sass

【解决方案1】：

这是预期的行为，根据Referencing Parent Selectors: &

我不建议使用这种技术，因为它违反直觉。

【讨论】：

谢谢@halfzebra，猜你是对的。 “& 将被替换为出现在 CSS 中的父选择器。这意味着如果您有一个深度嵌套的规则，则父选择器将在 & 被替换之前完全解析。”以这种方式使用 & 仍然非常强大，所以我不会完全打折，但这回答了问题:)
这不是一个真正的答案。是可以对您想要的选择器的任何部分进行修改，但 OP 从未指定 他们想用它做什么。