CSS 媒体查询、Opera 和 Firefox 问题答案

【问题标题】：CSS Media Queries, Opera and Firefox troubleCSS 媒体查询、Opera 和 Firefox 问题
【发布时间】：2013-02-16 05:05:47
【问题描述】：

我正在为我的网站使用 Ubuntu 字体，但 Opera 不会在我这样做时呈现页面：

html {
  font-family: 'Ubuntu', sans-serif;
}

所以我必须做 css 媒体查询：

/*Chrome*/
@media not all and (-webkit-min-device-pixel-ratio:0) {  
  html,
  button,
  input,
  select,
  textarea {
    font-family: 'Ubuntu',sans-serif;
  } 
}

/*Safari*/
@media screen and (-webkit-min-device-pixel-ratio:0) {
  html,
  button,
  input,
  select,
  textarea {
    font-family: 'Ubuntu',sans-serif;
  } 
}

/*Opera*/
@media not screen and (1) {
  html,
  button,
  input,
  select,
  textarea {
    font-family: sans-serif;
  } 
}

问题是现在我不知道如何为 Firefox 实现这个。搜索互联网并没有给我答案。

有什么想法吗？

亲切的问候。

【问题讨论】：

这里有一些关于这个问题的信息可能会有所帮助：askubuntu.com/questions/18972/…

标签： firefox css opera media-queries

【解决方案1】：

这样：

@media not all and (-moz-windows-compositor) { ... }

点击此处了解更多信息：https://developer.mozilla.org/en-US/docs/CSS/Media_queries

【讨论】：

你知道如何为 IE 实现这个吗？谢谢。
很遗憾，Internet Explorer 8 或更早版本不支持媒体查询。

【解决方案2】：

使用媒体查询-moz-windows-compositor，您只是针对 Windows/Linux 上的 Firefox，对于各种其他操作系统（如果您在那里的字体也有问题），您需要

 @media not all and (-moz-device-pixel-ratio) {…}

【讨论】：