Firefox特定媒体查询

Question

这可能是一个非常简单的问题，但是我很难受！我有一个外部CSS文件，该文件工作正常且响应迅速。可以预料，当在Firefox中查看时，一些元素的位置有些“偏离”。我想编写一个媒体查询，询问何时在Firefox中查看页面，并调整特定元素的边距等。我以为您可以使用前缀：

@-moz-document url-prefix()

作为媒体查询，但没有做任何事情。

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

Answer 1

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

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

观看此直播：http : //codepen.io/panchroma/pen/gpXdRj

有关Firefox供应商选择器的更多信息：https : //developer.mozilla.org/en-US/docs/Web/CSS/Mozilla_Extensions#font-family

更多浏览器选择器和黑客：http : //browserhacks.com

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

祝好运！

Answer 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){...}

更多信息在这里：

https://developer.mozilla.org/es/docs/CSS/Media_queries

最好的祝愿！！