3

我正在尝试将@font-face 用于 Chrome、Safari、Firefox 和 IE。对于 IE，我什至不知道该怎么做，但对于其他浏览器，我希望 @font-face 部分工作。

这是我用过的：

  @font-face {
  font-family: "Handwriter";
  src: url("/folder/Font-Regular.otf");
  }

然后我也尝试了：

 @font-face {
 font-family: "Handwriter";
 src: url("http://www.domain.com/folder/Font-Regular.otf");
 }

使用其中任何一个都可以在 Chrome 和 Safari 中正确呈现它，但在 Firefox 中则不行。有趣的是，如果我使用 Firebug 并转到 CSS 文件并再次重写名称，那么它会呈现它。此外，字体文件在我的服务器上，我在同一个域上渲染它。所以不确定这里出了什么问题。

4

2 回答 2

8

试试这个（使用您的自定义字体）。记住格式很重要：

@font-face {
  font-family: 'WebFont';
  src: url('myfont.woff') format('woff'),  /* Firefox 3.6+, IE9+, Chrome 6+, Safari 5.1+*/
       url('myfont.ttf') format('truetype');  /* Safari 3—5, Chrome4+, Firefox 3.5, Opera 10+ */
}

来源：css3please

于 2012-11-22T08:16:19.300 回答
3

这不是广告 :D

我成功地使用了http://www.fontsquirrel.com/fontface生成器 :) 如果你有 z ttf 文件，剩下的就是小菜一碟 :)

于 2013-01-15T17:11:27.090 回答