html - 尽管 IE，@font-face 在 Chrome 和 FireFox 中不工作

Question

抱歉，这个问题可能重复了，但我找不到我的问题的任何答案。在 css 中实现 @font-face 在 IE 中正常工作，但在 FireFox 和 Chrome 中无效。我想在我的网站上添加一个非标准字体，所以我将文件 Snazanin.ttf 和 Snaznnbd.ttf 放在与 css 文件相同的目录下，并在 css 中添加以下代码:

@font-face{
        font-family: MyFont;
        src:url('Snazanin.ttf')format('truetype')   ;
    }
    @font-face{
        font-family: MyFont;
        src:url('Snaznnbd.ttf')format('truetype');
        font-weight: bold;  
    }

在我的另一个 css 文件中:

#mainframe{
    width:666px;
    margin:0px auto 0px auto;
    font-family:MyFont;
}

同样在同一目录中，我有 .htaccess 文件，其中包含:

AddType font/ttf .ttf

正如我之前提到的，IE 没有问题，但 chrome 和 FireFox 无法显示 MyFont谢谢回答

Answer 1

我认为这与浏览器对文件类型的支持有关。以下是一些快速引用:

http://www.w3schools.com/cssref/css3_pr_font-face_rule.asp

http://caniuse.com/ttf

http://caniuse.com/woff

http://caniuse.com/eot

http://caniuse.com/svg-fonts

您可能需要提供多个字体文件。根据 w3schools 链接，ttf/eot 组合应该可以满足您的需求。