html – @ font-face没有加载字体

概述我正在尝试使用@ font-face,由于某种原因它无法正常工作(IE9,Chrome和Firefox).我已经确保在加载字体时指向正确的目录,但它似乎仍然无法正常工作. 这是我的代码： @font-face{font-family: 'test';src: url('../fonts/FontName.ttf'), url('../fonts/FontName.eot'); 我正在尝试使用@ Font-face,由于某种原因它无法正常工作(IE9,Chrome和firefox).我已经确保在加载字体时指向正确的目录,但它似乎仍然无法正常工作.

这是我的代码：

@Font-face{Font-family: 'test';src: url('../Fonts/Fontname.ttf'),url('../Fonts/Fontname.eot');Font-weight: normal;Font-style: normal;}

并称之为：

#header{text-align:left;padding: 10px;Font-family:test;}

我究竟做错了什么？

解决方法 Internet Explorer使用字体的.woff版本,代码中未使用该字体,而不是使用版本.eot.我使用了 fontsquirrel的 @font-face generator工具来获取所有不同的字体变体

输出应该如下所示：

@Font-face{Font-family: 'test';src: url('../Fonts/Fontname.eot'),url('../Fonts/Fontname.eot?#IEfix') format('embedded-opentype'),url('../Fonts/Fontname.woff') format('woff'),url('../Fonts/Fontname.ttf') format('truetype');Font-weight: normal;Font-style: normal;}

总结

以上是内存溢出为你收集整理的html – @ font-face没有加载字体全部内容，希望文章能够帮你解决html – @ font-face没有加载字体所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错，欢迎将内存溢出网站推荐给程序员好友。