这个博客文章(那里有点讨厌的页面)(顺便说一下,这不是我的博客)描述了我昨天在Internet Explorer 8中遇到的一个奇怪的错误.该bug涉及.EOT网络字体和<iframe>元素.
我没有广泛研究错误的确切触发器,但基本上是这样的情况:使用网页字体加载内容以<iframe>使框架也使用网络字体的页面被浏览器"污损".使用Web字体呈现的先前正常文本突然转变为看起来很糟糕的Arial或其他东西,单独排序.有时它会翻转,只会在鼠标移动等随机用户交互中再次降级.
那篇博文有一个例子.澄清一下,它是包含在内的页面,而不是页面中的内容<iframe>(至少,根据我的经验,情况就是如此).
是否有人找到了比该博客中建议的更好的解决方法,即强制<link>从@font-face声明到来的"重新加载"CSS 元素？(我可以做到这一点,但这只是一个小小的痛苦,而且它会迫使我将我的字体设置移出我的文档<head>,如果我记得这是一个性能问题;我将不得不四处寻找并再次发现这一点. )
编辑 - 更新
好的,这是一个测试页面.这是主(容器)页面:
<!DOCTYPE html>
<html>
<head>
<style id='font_style'>
@font-face {
font-family: 'bold-display';
src: url('DejaVuSans-Bold.eot');
}
</style>
<style>
.fancy { font-family: bold-display, "franklin gothic medium", "verdana", sans-serif; font-size: 32px; }
iframe { width: 500px; height: 200px; }
#floater {
position: absolute;
top: 100px; left: 100px;
display: none;
}
#floater.showing {
display: block;
}
</style> …