vue 兼容IE浏览器 报“@font-face 未能完成 OpenType 嵌入权限检查。权限必须是可安装的。”错误

最新推荐文章于 2023-07-21 10:15:29 发布
原创 最新推荐文章于 2023-07-21 10:15:29 发布 · 4.5k 阅读 · 7 ·
本内容遵循CC 4.0 BY-SA版权协议
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
标签
#兼容 #ie #字体 #vue #前端
本文介绍了解决IE浏览器中自定义字体兼容性问题的方法。通过使用@font-face规则，结合字体转换网站，将字体转换为IE兼容的.eot格式。下载并解压转换后的字体文件至项目font目录，与.ttf文件一同放置。在font.css文件中引入字体，即可在需要的页面上正常显示自定义字体。

再IE中兼容一直是一个很让人头疼的事情，做到自定义字体兼容的时候，发现报错了

是时候改变一下字体来提升观赏性了！！！

@font-face是CSS3新规则，针对IE惯例不是很友好，这就需要我们来转换一下字体格式了，我用的是

字体转换这个网站很不错，

将转换好的.eot文件下载解压到项目的font目录中，和你的.ttf字体文件放在一起，

在font.css文件中引入

在需要的页面引入该字体文件后，就可以正常显示咱们自定义的字体了

【IE11】CSS3114: @font-face 未能完成 OpenType 嵌入权限检查
Lyrelion的博客
12-14 2851
报错原因：@font-face 中有嵌入权限 (embedding permissions) ，IE浏览器对 Web字体 的嵌入需要这个权限 报错解决方案：针对 IE浏览器，将 EOT字体格式 修改成 'embedded-opentype'【翻译：嵌入式打开类型】，可以解决此问题
CSS3114: @font-face 未能完成 OpenType 嵌入权限检查。
热门推荐
彼岸の风的专栏
05-26 2万+
@font-face是CSS3中的一个模块, 它主要是把自己定义的Web字体嵌入到网页中, 让网页上使用的字体可以不受客户端字体库的限制. 这个功能虽然是非常HAPPY的, 但是在使用中还是会碰到一点问题 想学习的同学可以去这里 ( http://www.w3cplus.com/content/css3-font-face ) , 讲的非常不错, 下面我们来说问题 使用@font-fac
CSS3114：@font-face 未能完成 OpenType 嵌入权限检查。权限必须是可安装的。解决方案
NuoYan3327的博客
10-17 3834
话不多说，先来个错误提示图片。今天在使用ElementUI的icon样式时遇到了这个问题，这个问题会导致网页上的icon无法正常被显示出来。 需要注意的是这个错误并不会在谷歌或者其他高级浏览器中出现，只会在IE浏览器中出现，考虑到版本兼容性问题这里还是尝试着去网络上收集相关解决方案，看了很多文档其解决方案都是通过更换字体类型实现的，这里就不详细说了。 ...
CSS3114: @font-face 未能完成 OpenType 嵌入权限检查。权限必须是可安装的。
Rain~的博客
08-23 1万+
在开发web过程中，使用了方正正纤黑、方正正准黑等中文字体，通过font-face引入TTF格式文件，在Firefox、Chrome等浏览器上均能正常显示，但IE9、10及以上的浏览器报错：CSS3114: @font-face 未能完成 OpenType 嵌入权限检查。权限必须是可安装的。  解决办法为：引入ETO格式文件。
@font-face 未能完成 OpenType 嵌入权限检查。权限必须是可安装的。
WanweI897的博客
11-03 1523
使用ttf字体文件在ie下会报错，因为ie不支持ttf文件，不过ie支持eot文件。解决方法： @font-face { font-family: MicrosoftYaHei-Bold; src: url("../plugin/font/MicrosoftYaHei-Bold.eot"),url("../plugin/font/MicrosoftYaHei-Bold.ttf"); } ...
ie10- 报错@font-face 未能完成 OpenType 嵌入权限检查。权限必须是可安装的。
lixiaohua66的博客
05-05 2798
pc端上使用特殊字体，下载的安装包，但在ie10-不兼容，提示需要权限。 解决办法： 1.目前我使用的是一个ttf文件，打开http://www.motobit.com/util/base64-decoder-encoder.asp； 如图选择 然后选择文件上传，等一下就会自动转成一个base64.bin文件，可以重命名； 2.打开https://www.fontke.com/tool...
[IE] 在IE浏览器遇到的兼容问题或者非兼容问题
跬步
03-05 458
问题： 使用display: flex样式的元素和Chrome上面看到的不太一致 解决： 需要具体问题具体分析，最终修改成了display: block，对项目样式没有太大影响 问题： ES6语法问题，原本项目中已经在使用webpack打包是使用了进行语法转化，但是还是出现了语法问题，最终定位为使用的第三方库query-string的版本为6.+，其语法为ES6 解决： 降低了query-str...
关于使用WeUI在IE中提示“font-face 未能完成 OpenType 嵌入权限检查。权限必须是可安装的。”的问题...
08-13 470
@font-face是css3中定义字体的规则。 首先，在使用weui时，在Chrome、Firefox下没有问题，但是在IE下提示“font-face 未能完成 OpenType 嵌入权限检查。权限必须是可安装的”，如下图： 经过一番查找资料，解决方法如下： 1. 将@font-face中，字体的base64编码转换为字体文件。 a)访问http://www.mot...
vue-cli3 element-ui 打包后 IE中报错 @font-face 未能完成 OpenType 嵌入权限检查。权限必须是可安装的。
sfwk1993的博客
05-20 3215
框架：vue-cli3 element-ui版本："^2.8.2" 问题： 打包放到服务器上后，在ie中和以ie为内核的浏览器（例360兼容模式）下不能正常显示icon图标，且控制台报错 “@font-face 未能完成 OpenType 嵌入权限检查。权限必须是可安装的。” 首先，font-face是css3的字体规则，对于浏览器的支持情况如下图 在项目的 “node_modul...
@font-face ie下不生效问题
justS0的博客
06-08 9292
@font-face { font-family: "fffzzz"; src:url('./font.ttf'); src:url('./font_otf.otf'); src:url('./font_woff.woff'); src:url('./font_eot.eot'); } 以上写法ie生效了  chrom不生效 @font-face 在ie
VUE2项目在IE9+白屏报错语法错误的解决
New个对象喝咖啡
07-21 1418
使用@font-face引入自定义特殊字体，在IE9环境下报错“@font-face 未能完成 OpenType 嵌入权限检查。权限必须是可安装的。”错误。查明报错原因是： IE9不支持字体文件类型解决方案：转换字体为WOFF格式字体转换在需要的页面引入该字体文件后，就可以正常显示咱们自定义的字体了以上就是今天要讲的内容，希望可以帮到更多人解决IE兼容问题。本人在IE坑里好长时间才得到解决方案，希望这篇博客可以帮到你！
ie8下 @font-face遇到了未知错误 字体不适用于IE8 兼容性问题修复
Alan的博客
04-02 3891
bootstrap3.3.7css字体样式，在ie8浏览器下，一些字体图标glyphicon丢失，控制台报错：@font-face遇到了未知错误 xxxx.eot字体 ie是可以识别eot字体的，但是要添加验证 解决：把下面的对应需要加入的字体代码放入页面中 @font-face { font-family：“xxxx.eot”; src：url（'../fonts / ...
IE9,IE10不能显示@font-face定义的字体
weixin_33861800的博客
07-15 571
2019独角兽企业重金招聘Python工程师标准>>> ...
IE8下@font-face引入特殊字体兼容问题（format|?#iefix|两个url三问）
九日的博客
05-06 2421
问题表现： 使用@font-face引入自定义特殊字体，在IE8环境下报错“@font-face遇到了未知错误”，表现为字体丢失。 问题分析： 我们常用的字体文件的格式如： TrueType、Web Open Font格式对于IE浏览器来说，在IE9+版本才支持。IE8只支持Embedded Open Type格式的字体文件(.eot)。所以IE8环境下，想要引入自定义特殊字体，只能想办法转换...
.woff字体上传后无效的解决方案，同时包含:@font-face 未能完成opentype嵌入权限检查。权限必须是可安装的解决方案
易寒的专栏
01-20 1万+
随着移动网络的兴起，移动版网站图标大行其道。图片标由于体积大，对速度不够友好。所以现在较普遍的做法是做字体代替，当时前提是浏览器要支持CSS3。 字体图标较著名的是fontawesome-webfont.woff。 由于WOFF微软的IIS并不支持，所以当我们把使用此字体的网站发布到IIS上以后，会发现图标不见了。经过网络跟踪可以看到404错误。 这是因为.woff在IIS没有类型映
vue中@font-face引入字体，路径报错
小白正在变黑
01-19 1693
亲试有效：一般是在项目中使用了@import来引入css/scss文件的。那么就要找到这个css最终被引入的文件位置，然后相对于这个文件来写引入字体的路径。（一般这个问题容易被忽略0o.）
css自定义字体.ttf字体，ie不解析，提示font-face加载错误
坏坏熊的专栏
07-21 1万+
我们自己在程序中加载的字体，IE浏览器不让用。错误就是font-face加载错误，然后找答案是要处理一下字体，处理成.eot字体，发现ie还是让用，但是错误变成font-face位置错误。 因为我加载的是.ttf的字体样式，ie明显能在出来页面加载了 ，但是字体却没有效果，所以在外国网站找到了这段代码 @font-face {             font-family: '字体名称
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值