css - 铬的CSS字体系列问题

Question

这个CSS定义：

* {font-family: 'Lucida console', monospace;}

由Firefox正确解释。

使用 ubuntu-chromium (v18.0.1025..)，为了获得相同的字体，我写了

* {font-family: monospace 'Lucida console';}（是的，没有逗号）

您可以使用两种浏览器（嵌入在链接中的代码）尝试这个实时示例。

如何使“monospace lucida console”两者都可用？谢谢。

Answer 1

我找到了答案的开头。

Firefox (22.0) 控制台谈到：

[13:03:08,615] downloadable font: download failed 
  (font-family: "lucida_consoleregular" [...])
  bad URI or cross-site access not allowed
  source: http://www.goto.com/font/lucida_console-webfont.ttf 
  @ http://www.goto.com/css/style.css
  source: [...] lucida_console-webfont.woff
[13:03:08,615] downloadable font: no supported format found 

针对该网站的 DNS 从两个 URL 重定向：一个以“ w3 ”为前缀。另一个是“ www ”。字体路径是样式表是相对路径，但服务器根 URI 是唯一的，无论是 www 还是 w3

@font-face {
    font-family: 'lucida_consoleregular';
    src: url('../fonts/lucida_console-webfont.eot');
    src: url('../fonts/lucida_console-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/lucida_console-webfont.woff') format('woff'),
         url('../fonts/lucida_console-webfont.ttf') format('truetype');
}

调用与正确根 URI 相关的正确前缀时不会发生错误

另一方面，Ubuntu-Chromium（现在是 28.0）和 Opera（12.16）对此没有任何问题。