是否有SASS规则用于将后代输出到根？ [英] Is there a SASS rule for outputting a descendant to the root?

问题描述

使用SASS&指南针，你仍然可以缩进的后代方式写入，但添加一个规则/命令，使给定的后代写入另一个级别。 root？

Using SASS & Compass, can you still write in an indented descendant manner but add a rule/command so that the given descendant is written to another level e.g. root?

这样：

#example-id-1 {
    background: blue:

    #example-id-2 {
        background: red:

        #example-id-3 {
            background: yellow:
        }

    }

}

通常会输出：

#example-id-1 { background: blue: }
#example-id-1 #example-id-2 { background: red: }
#example-id-1 #example-id-2 #example-id-3 { background: yellow: }

但可以将规则应用于＃example-id-2 或＃example-id-3 ，以便输出变为：

but can a rule be applied to #example-id-2 or #example-id-3 so that the output becomes this:

#example-id-1 { background: blue: }
#example-id-2 { background: red: }
#example-id-3 { background: yellow: }

非常感谢。

推荐答案

您正在寻找 @ at-root ：

#example-id-1 {
    background: blue;

    @at-root #example-id-2 {
        background: red;

        @at-root #example-id-3 {
            background: yellow;
        }
    }
}

请注意，这是一个Sass 3.3功能。

Note that this is a Sass 3.3 feature.

这篇关于是否有SASS规则用于将后代输出到根？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！