0

我对 http://jakearchibald.github.com/sass-ie/ 中的目的$fix-mqs感到困惑

我可以看到 mixin 的其余部分是如何工作的,但无法弄清楚这部分。我已经在一个项目中使用了这种模式,如果我忽略它并将固定宽度放在一个旧的即包含在正文或通用包装器元素上,一切似乎都可以工作,例如:

.l-wrapper {
    @include old-ie {
        width: 960px;
    }
}

所以我的问题是它的$fix-mqs用途和作用是什么?

4

2 回答 2

0

$fix-mqs这个想法是,当您将(修复媒体查询)设置为特定宽度时,respond-min() mixin 将充当您的媒体查询。您最终会得到一个仅包含适用于定义宽度的样式且没有媒体查询的文档。

例如,如果$fix-mqs: 700px(大致桌面大小)并且您调用respond-min(400px)了 ,那么它不会发出这些样式,因为它们太小了。它在您调用时生成样式respond-min(800px)

不过,它不仅适用于 IE。一些非常旧的移动设备也不理解媒体查询。虽然大多数人建议在您的媒体查询中使用“移动优先”,但有一些非常具有破坏性的样式(通常很难撤消),我只会在它是一个狭窄的设备时应用(例如重新格式化一个宽表以垂直显示) .

于 2013-01-31T13:57:08.930 回答
0

$fix-mqs仅在 IE 样式表中使用respond-min和使用。respond-max

您设置$fix-mqs为您的桌面样式启动的宽度,但可能在您的“大规模”桌面样式启动之前(如果有的话)。

例如,如果我设置$fix-mqs: 900px,IE 样式表会拾取所有样式,如果视口宽度为 900 像素,则正常样式表会。

在实践中,当您调用respond-min(400px) { /* styles */ }普通样式表时,会获取媒体查询,而 IE 样式表会在400px小于或等于时获取样式$fix-mqs,否则将一无所获。

同样,当您调用respond-max(400px) { /* styles */ }IE 样式表时,如果大于 ,则获取样式400px,否则$fix-mqs一无所获。

于 2013-02-02T14:14:59.770 回答