Question

我使用网页字体代替图片文件。我被设计师给了原始字体，然后我通过Font Squirrel's @font-face generator制作了全套字体。我打开了他们提供的测试*.html文件以及导出的字体，并且它在我查看的每个浏览器中都能保持一致（包括IE7）。

我在我的服务器上安装了这个字体，并且它在我测试的每个浏览器中都一致地工作（包括IE9）除了IE7 。奇怪的是它在IE7中的工作时间大约是一半。因此，如果我只是反复刷新页面，那么它将随机工作大约一半的页面加载，而不是另一半的工作。

我已通过“开发人员工具”窗口多次清除缓存。

这是我用来包含字体的CSS：

@font-face {
    font-family: 'iconRegular';
    src: url('/static/fonts/icon-webfont.eot');
    src: url('/static/fonts/icon-webfont.eot?#iefix') format('embedded-opentype'),
         url('/static/fonts/icon-webfont.woff') format('woff'),
         url('/static/fonts/icon-webfont.ttf') format('truetype'),
         url('/static/fonts/icon-webfont.svg#iconRegular') format('svg');
    font-weight: normal;
    font-style: normal;

}

.icon,
.ui-widget-content .icon {
    font-family: 'iconRegular';
    font-weight: normal;
    font-style: normal;
    font-variant: normal;
}

我在一个大型应用程序中使用它（通过*.js加载~20 require.js个文件）;这可能与我申请的规模有关吗？

Answer 1

这似乎是IE7 / 8 @font-face处理中的一个错误，它出现在重量级的Web应用程序中（我的应用程序有~25个样式表和~50个Javascript脚本标记）。我通过浏览器嗅探IE7 / 8来修复它（羞耻！），在页面加载后等待500毫秒，然后在包含字体声明的样式表中添加第二个<link>标记。

IE8中图标的Webfonts

1 个答案: