Question

我关注了此视频：https://www.youtube.com/watch?v=t1nX5_2FQ8g 生成一个包含字体内容和css文件的文件夹，我将css代码复制到我的global.css

@font-face {
font-family: 'Conv_Origram';
src: url('fonts/Origram.eot');
src: local('☺'), url('fonts/Origram.woff') format('woff'), url('fonts/Origram.ttf') format('truetype'), url('fonts/Origram.svg') format('svg');
font-weight: normal;
font-style: normal;

}

@font-face {
    font-family: "FontAwesome";
    font-style: normal;
    font-weight: normal;
    src: url("../font/fontawesome-webfont.eot?#iefix&v=3.2.1") format("embedded-opentype"), url("../font/fontawesome-webfont.woff?v=3.2.1") format("woff"), url("../font/fontawesome-webfont.ttf?v=3.2.1") format("truetype"), url("../font/fontawesome-webfont.svg#fontawesomeregular?v=3.2.1") format("svg");
}

我将字体文件复制到该文件夹，并尝试了fontAwesome的位置，该位置适用于我的主题。但对于我的origram字体它不起作用。我在空白域上尝试了简单的html和css并且它有效，但是在我的prestashop主题中它没有。谢谢你的时间

Answer 1

Font-face需要稍微了解浏览器的不一致性，并且可能需要对Web服务器本身进行一些更改。您要做的第一件事是检查控制台以查看是否正在生成消息。它是权限问题还是找不到资源....？

其次，因为每个浏览器都期望不同的字体类型，我会使用Font Squirrel上传您的字体，然后生成所需的其他文件和CSS。 http://www.fontsquirrel.com/fontface/generator

最后，FireFox和IE的版本不允许跨域加载字体。您可能需要修改Apache配置或.htaccess（Header set Access-Control-Allow-Origin＆＃34; *＆＃34;）

@ font-face不适用于自定义字体

1 个答案: