Inheritance 媒体查询中的类可以使用继承吗？

假设我有：

@media (min-width: 768px) {
    .font-size-xxl {
        font-size: 48px;
    }
}

@media (max-width: 767px) {
    .font-size-xxl {
        font-size: 32px;
    }
}

@media (max-width: 479px) {
    .font-size-xxl {
        font-size: 16px;
    }
}

…我希望多个元素继承这些规则。我尝试使用较少的继承：

h1 {
    .font-size-xxl;
}

…但它就是不起作用。首先，它找不到类。如果我将它们从媒体查询中删除，但媒体查询覆盖不适用，则会发生这种情况

我想实现的目标可行吗？如果是，我错过了什么

如果有必要，我将使用grunt contrib减去1.4.0。

您可以使用

或

你可以用

或

---

至于您当前的方法不起作用的原因，它似乎只复制具有相同作用域的类的CSS（在媒体查询之外添加一个.font size xxl类可能会被使用，或者在每个媒体查询内部执行相同的操作可能会起作用）。但我找不到任何东西来证实这一点。这正是我所需要的。谢谢，@ColbySargent。至于当前方法不起作用的原因，它似乎只复制具有相同作用域的类的CSS（在媒体查询之外添加一个.font size xxl类会被使用，或者在每个媒体查询内部做同样的事情会起作用）。但我找不到任何东西来证实这一点。这正是我所需要的。谢谢，@ColbySargent.No，如果您想在全局范围内继承

.font size xxl

，您需要将它放在那里，从而将媒体静默放在里面。（也可以使用

extend

进行琐碎的属性克隆）。不，如果要在全局范围内继承

。font size xxl

，则需要将其放在全局范围内，从而将介质密钥放在其中。（也可使用

extend

进行琐碎的属性克隆）。

h1:extend(.font-size-xxl) {

}

h1 {
  &:extend(.font-size-xxl)
}