我知道有很多类似的问题，但是这种情况似乎非常奇怪。@font-face 在Internet Explorer 11（Windows 7 Pro）上好像出了问题。具体地说，版本：11.0.9600.17728，更新版本：11.0.18。
@font-face 在Chrome、Firefox、Safari和Opera上（适用时均为Linux和Windows）都能正常工作。事实上，它甚至在另一台我所拥有的运行Windows 7的机器上的Internet Explorer Version: 11.0.9600.17633，更新版本：11.0.16上也能工作良好。
开发者控制台中没有任何指示表明存在获取字体的问题。我已将html/css简化为一些非常基本的内容以重现该问题。在下面的示例中，两个自定义字体都无法正常工作（对于该特定IE版本）：
<html>
<head>
<link rel="stylesheet" type="text/css" href="test.css" />
</head>
<body>
<p>This font should be Roboto Thin</p>
<p>There should be icons below. If not, then font-face is not working.</p>
<span>a</span>
<span>b</span>
<span>c</span>
<span>d</span>
<span>e</span>
<span>f</span>
<span>g</span>
<span>h</span>
<span>i</span>
<span>j</span>
<span>k</span>
<span>l</span>
<span>m</span>
</body>
</html>
...以及 CSS：
@charset "UTF-8";
@font-face {
font-family: 'robotothin';
src: url('roboto-thin-webfont.eot');
src: url('roboto-thin-webfont.eot?#iefix') format('embedded-opentype'),
url('roboto-thin-webfont.woff') format('woff'),
url('roboto-thin-webfont.ttf') format('truetype'),
url('roboto-thin-webfont.svg#robotothin') format('svg');
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: 'typicons';
src: url('typicons-regular-webfont.ttf');
}
p {
font-family: robotothin;
font-size: 26px;
color: #666;
}
span {
font-family: typicons;
font-size: 30px;
color: #0062A8;
}
您可以在这里运行的代码中找到。
如果我使用那个引起问题的IE版本查看该页面，文本字体将是默认值，并且代替图标，您只会看到标签中的字母。
考虑到在我测试过的每个其他浏览器中@ font-face都在工作（即使是不同版本的IE 11），这可能是那个IE版本的错误吗？是否有任何方法可以修复或进一步调试？
typicons还是robotothin？ - Huangism