赞助商

css – @ font-face即问题

发布时间:2019-07-11 发布网站:脚本之家
脚本之家收集整理的这篇文章主要介绍了css – @ font-face即问题脚本之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我尝试了几种不同的方法在CSS中包含正确的字体.我知道我需要eot版本的字体才能在IE上运行,但是我无法识别它.我使用字体squirrel来转换字体,我将.eot文件和.otf文件放在一个名为“fonts”的文件夹中.这是我的CSS:
@font-face {
    font-family: BebasNeue;
    src: url('fonts/BebasNeue.eot');
    src: url('fonts/BebasNeue.otf') format("opentype");
}

UPDATE
因此,通过以下建议,我被引导到这个网站:http://www.fontspring.com/blog/further-hardening-of-the-bulletproof-syntax

我使用CSS:

@font-face {
font-family: 'BebasNeue';
src: url('fonts/bebasneue.eot'); /* IE9 Compat Modes */
src: url('fonts/bebasneue.eot?#iefix') format('embedded-opentype'),/* IE6-IE8 */
     url('fonts/bebasneue.woff') format('woff'),/* Modern Browsers */
     url('fonts/bebasneue.ttf')  format('truetype'),/* Safari,Android,iOS */
     url('fonts/bebasneue.svg#svgBebasNeue') format('svg'); /* Legacy iOS */
}

然后我回到Font Squirrel,再次下载了新的套件,并正确地重命名了一切,并且它有效.

解决方法

您需要为此设置Access-Control-Allow-Origin HTTP标头
看这里:
IE9 blocks download of cross-origin web font

这有用吗?

@font-face {
    font-family: 'BebasNeue';
    src: url('fonts/BebasNeue.eot');
    src: url('fonts/BebasNeue.eot?#iefix') format('embedded-opentype'),url('fonts/BebasNeue.otf') format("opentype");
}

在Fontsquirrel他们这样做
http://www.fontsquirrel.com/fontfacedemo/bebas-neue

从那里下载@ font-face工具包

@font-face {
    font-family: 'BebasNeueRegular';
    src: url('/utils/load_demo_font.php?font=960/BebasNeue-webfont.eot');
    src: url('/utils/load_demo_font.php?font=960/BebasNeue-webfont.eot?#iefix') format('embedded-opentype'),url('/utils/load_demo_font.php?font=960/BebasNeue-webfont.woff') format('woff'),url('/utils/load_demo_font.php?font=960/BebasNeue-webfont.ttf') format('truetype'),url('/utils/load_demo_font.php?font=960/BebasNeue-webfont.svg#BebasNeueRegular') format('svg');
    font-weight: normal;
    font-style: normal;

}

总结

以上是脚本之家为你收集整理的css – @ font-face即问题全部内容,希望文章能够帮你解决css – @ font-face即问题所遇到的程序开发问题。

如果觉得脚本之家网站内容还不错,欢迎将脚本之家网站推荐给程序员好友。

本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:76874919,请注明来意。
标签: