sass - Sass @extend在媒体查询中

This question already has answers here:

Extending selectors from within media queries with Sass

（6个答案）


7年前关闭。





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

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

之所以设置警告，是因为我在介质外部声明了.root。在@media之外，它用于常规布局，然后在同一选择器内部，用于更改页面的布局。
但是这里的目标是仅当.extending是max-width时，将900px的颜色设置为蓝色，否则我不需要任何设置。

因此，问题是如何在媒体查询中使用@extend而不用无礼地向我抛出错误？

最佳答案

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

您真的知道生成的CSS的外观吗？ @extend是选择器的聚合器，这可能会导致非常混乱的CSS代码。

我对@extend规则的建议：避免@extending常规规则，请改用％placeholder规则。