【IE11】CSS3114: @font-face 未能完成 OpenType 嵌入权限检查

目录

一. 场景再现 

报错内容：CSS3114: @font-face 未能完成 OpenType 嵌入权限检查

报错原因：@font-face 中有 嵌入权限 ( embedding permissions ) ，IE浏览器对 Web字体 的嵌入需要这个权限

报错解决方案：针对 IE浏览器，将 EOT字体格式 修改成 'embedded-opentype'【翻译：嵌入式打开类型】，可以解决此问题

二. 修改示例

---

@font-face —— 用于把自定义的 Web字体 嵌入到网页中，这样网页就可以不受客户端字体库的限制

---

一. 场景再现 

• 使用 @font-face 的页面进行 本地测试，各浏览器字体显示正常；
• 但上传至服务器端后访问，IE11 不能正常显示 Web字体，Chrome 和 Firefox 字体显示均正常；
• 报错如图：

• ---

  报错内容：CSS3114: @font-face 未能完成 OpenType 嵌入权限检查

• ---

  报错原因：@font-face 中有 嵌入权限 ( embedding permissions ) ，IE浏览器对 Web字体 的嵌入需要这个权限

• ---

  报错解决方案：针对 IE浏览器，将 EOT字体格式 修改成 'embedded-opentype'【翻译：嵌入式打开类型】，可以解决此问题

---

二. 修改示例

• 修改前的 引入字体部分 的代码：

@font-face {
    font-family:'SourceHanSansCN-Normal';
    src:url('fonts/SourceHanSansCN-Normal.eot');
    src:local('☺'),
        url('fonts/SourceHanSansCN-Normal.woff') format('woff'),
        url('fonts/SourceHanSansCN-Normal.ttf') format('truetype'),
        url('fonts/SourceHanSansCN-Normal.svg#webfontOTINA1xY') format('svg');
        font-weight:normal;
        font-style:normal;
}

• ---

  修改后的 引入字体部分 的代码，多了一句话：url('fonts/SourceHanSansCN-Normal.eot?#iefix') format('embedded-opentype')

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