如何在Firefox中正确渲染@ font-face？ [英] How to properly render @font-face in Firefox?

问题描述

我尝试对Chrome，Safari，Firefox和IE使用@ font-face。对于IE我甚至不知道该怎么做，但对于其他浏览器，我想要@ font-face部分工作。

I am attempting to use @font-face for Chrome, Safari, Firefox, and IE. For IE i am not even sure what to do but for the other browsers I want the @font-face part to work.

这里是我使用的：

  @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中正常显示， 。有趣的是，如果我使用Firebug并转到CSS文件并重新编写名称，然后它呈现它。此外，字体文件是在我的服务器上，我在同一个域上显示此。所以不知道这里发生了什么。

Using either of these will render it properly in Chrome and Safari but not in Firefox. The funny thing is that if I use Firebug and go to the CSS file and rewrite the name again then it renders it. In addition, the font file is on my server and I am rending this on the same domain. So not sure what is going wrong here.

推荐答案

请尝试使用您的自定义字体。记住格式很重要：

try this (with your custom fonts). Remember the format is important:

@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

这篇关于如何在Firefox中正确渲染@ font-face？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！