Bootstrap图标显示正常，但IE11报错CSS3111。

Question

在IE11中，Bootstrap glyphicon 显示正常，但控制台报告这些文件的错误：CSS3111：@font-face 遇到未知错误

• glyphicons-halflings-regular.eot
• glyphicons-halflings-regular.woff
• glyphicons-halflings-regular.ttf

以下是我样式表中的 Bootstrap 覆盖（只更改了URL路径）：

@font-face {
    font-family: 'Glyphicons Halflings';
    src: url('../../vendor/bootstrap/fonts/glyphicons-halflings-regular.eot');
    src: url('../../vendor/bootstrap/fonts/glyphicons-halflings-regular.eot?#iefix') format('embedded-opentype'),
        url('../../vendor/bootstrap/fonts/glyphicons-halflings-regular.woff2') format('woff2'), 
        url('../../vendor/bootstrap/fonts/glyphicons-halflings-regular.woff') format('woff'), 
        url('../../vendor/bootstrap/fonts/glyphicons-halflings-regular.ttf') format('truetype'), 
        url('../../vendor/bootstrap/fonts/glyphicons-halflings-regular.svg#glyphicons_halflingsregular') format('svg');
}

顺便提一下： 如果我在第一个src网址后面添加!important，则图标不会显示出来。

@font-face {
    font-family: 'Glyphicons Halflings';
    src: url('../../vendor/bootstrap/fonts/glyphicons-halflings-regular.eot') !important;
...}

使用Bootstrap 3.3.4，IE11

如何消除错误？

- ruhong

---

我想这可能对你有所帮助...https://dev59.com/WWgu5IYBdhLWcg3wHzoX - Mahabub Islam Prio

Answer 1

这可能与一个名为“不信任字体阻止”的组策略设置有关。在此处阅读更多信息：IE 11：我的代码中出现错误CSS3111，google.com/fonts无法呈现任何字体。

- Fraser Crosbie

Answer 2

我猜这可能对你有所帮助...

IE9 - CSS3111: @font-face遇到未知错误

还有这些，

如果你遇到神秘错误，可以尝试http://fontface.codeandmore.com/blog/ie-7-8-error-with-eot-css3111/。

现在http://fontface.codeandmore.com的解决方案已经集成了FontForge，因此你可以直接使用http://fontface.codeandmore.com来转换你的字体。

- Mahabub Islam Prio

---

我宁愿不修改第三方文件（根据您的回答，这是Bootstrap的.eot文件）。我不想在我的构建过程中添加不必要的步骤。如果有人可以验证这确实是Bootstrap的问题，那么我将在他们的GitHub存储库上提交此问题。 - ruhong

请随时提出问题，在那里我们欢迎你的到来。如果您得到了合适的解决方案，请在此处发布解决方案，这对我们而言真的非常棒。 - Mahabub Islam Prio