Firefox 特定的媒体查询答案

【问题标题】：Firefox specific media queriesFirefox 特定的媒体查询
【发布时间】：2019-09-21 20:21:33
【问题描述】：

这可能是一个非常简单的问题，但我很难过！我有一个运行良好且响应迅速的外部 CSS 文件。不出所料，在 Firefox 中查看时，一些元素的定位有点“偏离”。我想为在 Firefox 中查看页面的时间编写一个媒体查询，并调整特定元素的边距等。我以为你可以使用前缀：

@-moz-document url-prefix()

作为媒体查询，但这没有任何作用。

当页面在 Firefox 和 Safari 中查看时，如何编写媒体查询？

【问题讨论】：

【解决方案1】：

您可以使用您提到的选择器，例如：

@-moz-document url-prefix() {
  h1, p{
    color:pink;
  }
}

更多浏览器选择器和技巧：http://browserhacks.com

FWIW，您是否仔细检查过您的 FireFox 布局问题与浏览器默认设置无关，并且无法通过使用不同的 CSS 重置来解决？我过去曾通过normalize.css 取得成功

祝你好运！

【讨论】：

非常感谢，大卫！这就是我所拥有的，但它不起作用，但我会再试一次。 Firefox 中需要更改的只是边距的百分比——我无法想象这与浏览器默认设置问题有关，不是吗？我的所有页面都包含 normalize.css。
这次成功了！！我第一次肯定有什么问题。太感谢你了！！！！！！！ :)

【解决方案2】：

此查询仅影响 Mozilla 导航器：

@media all and (min--moz-device-pixel-ratio:0) and (max-width: 680px){...}

这仅适用于 IE：

@media screen and (-ms-high-contrast:active), (-ms-high-contrast:none) and (max-width: 680px){...}

祝你好运！！

【讨论】：