自定义字体在IE中消失

时间:2013-05-07 14:13:46

标签: css internet-explorer caching font-face

这是我第一次看到自定义字体嵌入时发生这种情况。作为参考,我有几十个使用自定义字体的客户端网站没有问题。

此特定客户端具有自己创建的自定义字体文件。不幸的是,有问题的应用程序存在于主站点上的iframe中(域/子域匹配,但主页,iframe和字体文件之间)。

当页面第一次加载时,字体显示效果很好。刷新页面后,字体就会被破坏:它会恢复为后备("Sans-Serif")字体,字母间距全部被抬起。

正在使用3个单独的字体文件,所有字体文件都显示相同的行为。我相信这是一个缓存问题。最初正确显示字体表明文件正常,参考路径正确,域安全性不是问题。

我们正在使用font-squirrel生成的css进行嵌入。到目前为止我只在IE8上测试过,虽然我被告知IE9有同样的问题。其他浏览器似乎没有任何字体问题。

不幸的是,我不能分享这是什么网站。

@font-face {
    font-family: 'myfont70';
    src: url('../font/myfont-070.eot');
    src: url('../font/myfont-070.svg#myfont70') format('svg'),
    url('../font/myfont-070.eot?#iefix') format('embedded-opentype'),
    url('../font/myfont-070.woff') format('woff'),
    url('../font/myfont-070.ttf') format('truetype'),
    url('../font/myfont-070.svg#myfont70') format('svg');
    font-weight: normal;
    font-style: normal;
}

(SVG的双重声明是故意的)

谢谢!

1 个答案:

答案 0 :(得分:0)

这特别是由于在IE中的iframe中保存。解决方案是刷新声明字体系列的css标签上的href。这并不理想,因为它会触发css的重新加载,并且字体会瞬间闪回其后备。

如果有人有更好的解决方案,我都是眼睛。