css – 嵌入字体声明(@ font-face)中的数据URI会破坏IE <9

前端之家收集整理的这篇文章主要介绍了css – 嵌入字体声明(@ font-face)中的数据URI会破坏IE <9前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我有一个带有@ font-face声明的CSS文件,它通过数据URI嵌入字体文件
@font-face {
    font-family: 'Custom-Font';
    src: url('eot/font.eot');
    src: url('eot/font.eot?#iefix') format('embedded-opentype'),/* ugly FF same-Origin workaround... */
        url("data:application/octet-stream;base64,d09GRgABAAAAA ... ") format('woff'),url('ttf/font.ttf') format('truetype'),url('svg/font.svg#Custom-Font') format('svg');
    }

使用数据URI嵌入字体会导致IE< 9不加载字体.如果我删除该行(或将其更改为引用.woff文件),IE将加载该字体. 这个CSS怎么会混淆IE? 背景:我有一个页面可以加载来自不同域(CDN)的嵌入字体.不幸的是,Mozilla requires a CORS header(Access-Control-Allow-Origin)嵌入式字体来自不同的域(在我看来是CORS的abuse和糟糕的想法).由于我无法控制的原因(官僚主义),我无法获得字体文件发送的CORS标题,因此我坚持通过数据URI将字体文件嵌入CSS文件的次优情况.

解决方法

可能超过了 maximum URL length. 请记住,IE的旧版本之间添加了所有内容?和最后一个’); (包括数据URI). 所以在你的情况下,解决方案是使用另一种方法(例如Mo’防弹装置).

猜你在找的CSS相关文章