Question

我的网站中有两个浏览器的@ font-face存在问题：Firefox和Chrome。

在Firefox中，@ font-face规则不起作用，它使用后备字体-Helvetica-

我在样式表的顶部声明了这样的字体：

@font-face {
font-family: 'pf_centro_sans_proregular';
src: url('http://static.algarabia.com/CDN/fonts/pfcentrosanspro-reg-webfont.eot');
src: url('http://static.algarabia.com/CDN/fonts/pfcentrosanspro-reg-webfont.eot?#iefix') format('embedded-opentype'),
     url('http://static.algarabia.com/CDN/fonts/pfcentrosanspro-reg-webfont.woff') format('woff'),
     url('http://static.algarabia.com/CDN/fonts/pfcentrosanspro-reg-webfont.ttf') format('truetype'),
     url('http://static.algarabia.com/CDN/fonts/pfcentrosanspro-reg-webfont.svg#pf_centro_sans_proregular') format('svg');
font-weight: normal;
font-style: normal;

}

如果我在浏览器中输入URI，它会毫无问题地下载字体，因此，字体就在那里（Opera和Safari用正确的字体显示网站）

在Chrome中突然（我想有一些更新）菜单更改为后备字体，是的，只是菜单，网站的其余部分按预期运行。

我知道字体在那里，我的CSS不应该那么糟糕，因为它可以在Safari（桌面和移动设备）和Opera中使用。

有这方面的任何提示吗？

感谢您的时间和帮助。

Answer 1

只需将字体网址从http://fonts.googleapis.com/css更改为https://fonts.googleapis.com/css即可保护此链接。

@ font-face无法在Chrome和Firefox中使用

1 个答案: