Css 介质查询中的扩展较少，不工作

我的小扩展不起作用，我不知道为什么这里有一些我的文件片段

这里来自全球。较少：

// Global Modifier
.is--rounded { .border-radius(); }

.is--block { display: block !important; }
.is--inline { display: inline !important; }
.is--inline-block { display: inline-block !important; }
.is--hidden { display: none !important; }
.is--invisible { visibility: hidden !important; }

这来自标题。less有效

.header-gray {
    .shop--navigation {
        &:extend(.is--hidden);
    }
}

这是从相同的标题中删除的。虽然较少，但不起作用

@media screen and (min-width: 480px) {
    .header-gray {
        .shop--navigation {
            &:extend(.is--block);
        }
    }
}

有语法错误吗？或者问题出在哪里？

来自较少的文档：“写入媒体声明中的扩展应该只匹配同一媒体声明中的选择器”

---

因为第二个示例包装在媒体查询中，.is--block声明需要匹配

我是否必须在每个视口中放置所有类，如.is--block？@Artij对于这个用例，使用mixin而不是extend更有效。扩展“一个属性类”实际上并没有带来任何好处（特别是当它应用于长选择器名称规则集时）。