IE8下@font-face引入特殊字体兼容问题（format|?#iefix|两个url三问）

问题表现：
使用@font-face引入自定义特殊字体，在IE8环境下报错“@font-face遇到了未知错误”，表现为字体丢失。

问题分析：
我们常用的字体文件的格式如：

1. TrueType、Web Open Font格式对于IE浏览器来说，在IE9+版本才支持。IE8只支持Embedded Open Type格式的字体文件(.eot)。所以IE8环境下，想要引入自定义特殊字体，只能想办法转换格式或者下载.eot格式的字体文件。字体格式转换网址
2. IE8环境下可以识别.eot字体但是要写format(‘embedded-opentype’)添加验证。

问题解决

<div>字体测试</div>
 <style>
        @font-face {
           font-family: "yhg";
           src: url(../fonts/方正清刻本悦宋简体.eot);
           src: url(../fonts/方正清刻本悦宋简体.eot?#iefix) format('embedded-opentype'),
                url(../fonts/方正清刻本悦宋简体.TTF) format('truetype');
           font-weight: normal;
           font-style: normal;
       }

       div {
           font-family: "yhg";
       }
   </style>

模拟IE8环境

效果：

1. format用于标注字体的格式，方便浏览器识别。
2. ?#iefix：IE8版本环境，当 src 中包含多个 url 时无法正确解析返回 404 ，而其他浏览器没有这个问题。因此将 EOT 格式的引入放在最前面，然后在 url 后加上 ?，这样 IE8环境时会把问号之后的内容当作 url 的参数。 #iefix 一是注释，二是可以将 url 参数变为锚点，减少发送给服务器的字符。
3. 两个url：微软修改了在兼容模式下的 CSS 解析器，导致上面提到的使用 ? 的方案失效。由于 CSS 是从下往上解析的，所以在上面添加一个不带问号的 src 属性便可以解决此问题。