自定义字体在 IE8 中呈现错误答案

【问题标题】：Custom font renders buggy in IE8自定义字体在 IE8 中呈现错误
【发布时间】：2013-11-06 23:58:24
【问题描述】：

由于特定的客户要求，我需要使用 IE8 作为网站的主浏览器，他们要求在页面标题上使用自己的自定义字体。 H1 更准确。我遇到的问题是，在完全相同的页面上（无论页面如何），有时使用自定义字体正确呈现标题，但有时 IE8 会弄乱文本并显然应用后备字体。

下面是两张截图，一张正确应用了字体，一张没有应用字体：

好字体：

字体不好：

我有以下样式表，我在其中定义了该自定义字体的规则。我提前道歉，但我不能公开字体名称（NDA 生效）。

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

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

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

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

以及我为标题设置字体系列的样式表：

h1 {
    color: #E60000;
    font-family: 'secretfont_ltregular', Arial, Helvetica, sans-serif;
    font-size: 36px;
}

我已经尝试了所有我能想到的方法，但似乎无法从 IE8 中获得一致的行为。我该怎么做才能让它正常工作？

【问题讨论】：

标签： html css fonts internet-explorer-8

【解决方案1】：

我遇到了类似的问题 - IE8 已成功加载所有 EOT 文件，但只是偶尔应用。在经历了很多挫折之后，唯一可行的方法是在标签下方添加 chrome frame 元标签：

<meta http-equiv="X-UA-Compatible" content="ie=edge,chrome=1" />

请注意，2014 年 1 月 http://www.chromium.org/developers/how-tos/chrome-frame-getting-started987654321@

不再支持 chrome 框架

【讨论】：