css - LESS:在类中呈现媒体查询的内容(回退)

Question

您知道是否有一种方法可以将媒体查询的完全相同的内容渲染到 LESS 中的类中？

为了解释我的情况:我先做移动，并试图避免被媒体查询覆盖。不幸的是，这最终排除了 ie8 及以下版本，因为大多数桌面样式都包含在媒体查询中。我只为 IE8(固定宽度)提供桌面页面。

所以在一天结束的时候，我想把这个结合起来:

@media (min-width: 769px) {
    color: red;
}
.ie8 & {
    color: red;
}

用逗号链接它不起作用，因为它无效 (@media (min-width: 769px),.ie8 {})。在 Sass 中，我可以通过使用 @content 进行混合来实现这一点。但我无法在 LESS 中做到这一点。

有没有人知道如何在 LESS 中执行此操作？也许有一个循环？

Answer 1

我有同样的问题，在提出关于分离规则集的建议后，我开发了一个可能的解决方案解释 here in details .

主要优点如下:

• 可以为媒体查询设置屏幕宽度的自定义值，
• 传递媒体查询中使用的属性的 MIN/MAX 值(尝试传递“max”而不是“min”调用 .MEDIAQUERY混合)
• 通过 @only-media bool 值切换简单媒体查询或媒体查询 + 后代选择器的生成。