Sass @extend在媒体查询中

Question

现在没有错误，但Sass给我一个DEPRECATION WARNING，因为我在我的一个媒体查询中使用了@extend。 我有这样的事情：

.root{
    color: red;
}
@media (max-width: 900px) {
    .root{
        color: blue;
    }
    .extending{
        @extend .root;
    }
}

警告已设置，因为我在媒体之外声明了.root。在@media之外是正常布局，然后在同一个选择器内部用于更改页面的布局。 但是，此处的目标是让.extending仅在max-width为900px时将其颜色设置为蓝色，否则我不希望设置任何内容。

所以问题是如何在我的媒体查询中使用@extend而不会给我一个错误？

Answer 1

您可以尝试@mixin规则而不是@extend。

你真的知道生成的CSS会是什么样子吗？ @extend是选择器的聚合器，这可能最终导致非常混乱的CSS代码。

我对@extend规则的建议：避免@extending常规规则，改为使用％占位符规则。