CSS字体网址不起作用？答案

【问题标题】：CSS Font-Face url not working?CSS字体网址不起作用？
【发布时间】：2014-02-02 02:24:12
【问题描述】：

我在使用 @font-face 选择器时遇到了一些问题，我有以下问题...

@font-face {
   font-family: 'MuseoSans-700';
      src: url('http://mysite.co.uk/clients/reload/Images/style_159306.eot');
      src: url('http://mysite.co.uk/clients/reload/Images/style_159306.eot?#iefix')  format('embedded-opentype'),
           url('style_159306.woff') format('woff'),
           url('style_159306.ttf') format('truetype');
    }

只有我的字体没有被渲染，而是显示我的备用字体，arial。

如果我将字体的 url 粘贴到浏览器中，它会要求我下载以便我知道链接正确，我在上面做错了什么吗？

我正在使用...调用字体

h1 {
color:#272727;
font:108px 'MuseoSans-700',Helvetica,Arial,sans-serif;
letter-spacing:-7px;
}

谢谢

【问题讨论】：

Firefox，我也在 Chrome 中测试过
Nevermind 现在似乎在 Chrome 中工作，知道为什么 FF 不会渲染它吗？

标签： css html fonts font-face

【解决方案1】：

查看这篇关于防弹@font-face 语法的文章。 http://paulirish.com/2009/bulletproof-font-face-implementation-syntax/

您也没有指定它在哪些浏览器中工作或不工作，所以我认为它在其中任何一个中都不工作。

【讨论】：

【解决方案2】：

.eot 用于 Internet Explorer。
试试 .otf

所以在实践中你需要同时拥有两者，比如

例如

@font-face {
     font-family: 'MuseoSans-700';
 src: url('http://mysite.co.uk/clients/reload/Images/style_159306.eot');
 src: url('http://mysite.co.uk/clients/reload/Images/style_159306.otf');
}

一个很好的教程在这里：http://www.evotech.net/blog/2010/01/font-face-browser-support-tutorial/

Strelok 对 Paul Irish 的文章的引用也很不错。

【讨论】：