css - 字体在 mozilla 和 chrome 中不起作用

Question

我在 mozilla 浏览器和 chrome 中遇到字体问题。实际上，我使用 font-face 并且它工作正常，但这是我第一次使用 font-face with font : Penshurst 并且它不起作用。当我使用另一种字体时工作正常。

这是我的字体代码:

@font-face{
    font-family:Penshurst;
    src:url("../../plugin/font/penshurst.ttf"),url("../../plugin/font/penshurst.eot");
}
@font-face{
    font-family:Century Regular;
    src:url("../../plugin/font/century gothic regular.ttf"),url("../../plugin/font/century gothic regular.eot");
}

对于字体为 Century Regular 的字体，它工作正常，但对于 Penshurst 它不起作用。

对这个问题有什么建议吗？谢谢

Answer 1

正确的格式是:

@font-face {font-family: 'Penshurst';
    src: url('../../plugin/font/penshurst.eot');
    src: url('../../plugin/font/penshurst.eot?#iefix') format('embedded-opentype')? /* if needed for IE */,
         url('../../plugin/font/penshurst.ttf') format('truetype'),
    font-weight: normal;
    font-style: normal;
}

还有...你可能需要这个:

     `url('../../plugin/font/penshurst.woff') format('woff'),`

...您可能需要转换才能获得此...(请参阅下面我评论中的链接)

确保您的服务器 IIS 具有 .eot/.otf/.ttf/.woff 的 MIME 类型，这样您就可以在本地或在线(服务器)预览它们……最后，即使您可以看到 Century Regular 也没有这并不意味着您的服务器/本地主机中的 Penshurst

:)