为什么媒体查询中更高的最大宽度会覆盖较低的最大宽度？

Question

我的页面宽度低于991px，而“max-width 1200px”仍覆盖了css中的'max-width 991px'规则。

这是我的devtools窗口的屏幕截图：

这可以通过在'margin-top ...'css规则后面添加'！important'来解决。但我仍然想知道为什么会这样。

Answer 1

您必须更改媒体查询的顺序...

在你的情况下，最大宽度，你应该在你的css

因为config.assets.debug = false 也是真的并且稍后出现，所以它被覆盖（看看行数！:)）