Question

我已经搜索了它的解决方案，我认为，我正在做所有的建议，但它仍然无法正常工作。自定义字体适用于Chrome，IE，但不适用于Firefox。我使用字体生成器生成字体和代码。我已将@ font-face代码放在header，custom.css文件（在theme_root / css /中）以及style.css中，但它无效。

将它放在header.php中：

<style>

@font-face {
    font-family: 'Bebas Neue';
    src: url('fonts/bebasneue.eot');
    src: url('fonts/bebasneue.eot?#iefix') format('embedded-opentype'),
    url('fonts/bebasneue.svg#Bebas Neue') format('svg'),
    url('fonts/bebasneue.woff') format('woff'),
    url('fonts/bebasneue.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}
</style>

将它放在style.css：

中

@font-face {
    font-family: 'Bebas Neue';
    src: url('fonts/bebasneue.eot');
    src: url('fonts/bebasneue.eot?#iefix') format('embedded-opentype'),
    url('fonts/bebasneue.svg#Bebas Neue') format('svg'),
    url('fonts/bebasneue.woff') format('woff'),
    url('fonts/bebasneue.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

将其放在custom.css中：

@font-face {
    font-family: 'Bebas Neue';
    src: url('../fonts/bebasneue.eot');
    src: url('../fonts/bebasneue.eot?#iefix') format('embedded-opentype'),
    url('../fonts/bebasneue.svg#Bebas Neue') format('svg'),
    url('../fonts/bebasneue.woff') format('woff'),
    url('../fonts/bebasneue.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

无处不在，除了Firefox。我糊涂了 http://tour.khujbo.com

此外，此字体在Firefox中的html页面中工作正常。我在此模板中使用了此字体，它适用于Firefox：http://khujbo.com。在我看来，这与Firefox和WordPress组合的问题。

我该怎么办？

Answer 1

我认为你不需要在任何地方定义这个字体。您只能将CSS放在custom.css中。并且，您已使用错误的网址定义"Bebas Neue" font-face中的header.php。 CSS正试图从(woff, ttf, etc)获取字体http://tour.khujbo.com/fonts/。请使用正确的位置更正您的CSS。

BTW，我的建议是，你只需从custom.css放置并加载CSS并删除所有其他定义。

希望这能解决您的问题。

Answer 2

您必须始终确保该字体在您的网站上使用是合法的。

但Firefox和Chrome都应支持TTF。

从here.

获取更多信息

Answer 3

请确保您将字体转换为所有格式，请尝试使用此网站http://everythingfonts.com/font-face并且路径应该正确！

@font-face {
font-family: 'GE SS Unique';
src: url('../../fonts/GE_SS_Unique_Light.eot');
src: url('../../fonts/GE_SS_Unique_Light.eot?#iefix') format('embedded-opentype'),
    url('../../fonts/GE_SS_Unique_Light.woff') format('woff'),
    url('../../fonts/GE_SS_Unique_Light.ttf') format('truetype'),
    url('../../fonts/GE_SS_Unique_Light.svg#GE_SS_Unique_Light') format('svg');
font-weight: normal;
font-style: normal;}

h1,h2,h3,h4,h5,h6{
font-family: 'GE SS Unique';

}

自定义字体在Firefox中不起作用。

3 个答案: