Html Font Awesome 4.2.0 未在 IE11 中呈现，兼容模式已打开
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/27913012/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Font Awesome 4.2.0 not rendering in IE11 with Compatibility Mode turned "On"
提问by racecarjonathan
Font Awesome 4.2.0 renders perfectly in Chrome, Firefox, Safari, Opera, and Internet Explorer 11 (but only with Compatibility Mode turned "Off"). With Compatibility Mode turned "On" no glyphicons render. I've tried using a tried-and-true Font Awesome 4.2.0 CDN that I've used in other projects, using the Font Awesome CSS, and adding the <meta http-equiv="X-UA-Compatible" content="IE=edge">in the <head>as suggested from a GitHub post to allow the glyphs to render with Compatibility Mode turned "On". None of those solutions work and having Compatibility Mode turned "Off" is not an option for this project. So, in conclusion, my question is this. How can I have Font Awesome 4.2.0 render in Internet Explorer 11 with Compatibility Mode turned "On"?
Font Awesome 4.2.0 在 Chrome、Firefox、Safari、Opera 和 Internet Explorer 11 中完美呈现（但仅在兼容模式关闭的情况下）。兼容模式打开“打开”没有字形渲染。我已经尝试使用我在其他项目中使用过的久经考验的 Font Awesome 4.2.0 CDN，使用 Font Awesome CSS，并按照 GitHub 帖子<meta http-equiv="X-UA-Compatible" content="IE=edge">中的<head>建议添加以允许字形渲染兼容模式已打开。这些解决方案都不起作用，并且“关闭”兼容模式不是该项目的选项。所以，总而言之，我的问题是这个。如何在 Internet Explorer 11 中呈现 Font Awesome 4.2.0，并且兼容模式已打开？
回答by racecarjonathan
Found the solution. <meta http-equiv="X-UA-Compatible" content="IE=edge">needs to be placed as the FIRSTtag in the <head>in order for it to work. Hope this helps anyone else who has this issue!
找到了解决办法。<meta http-equiv="X-UA-Compatible" content="IE=edge">需要作为FIRST标签放置在<head>中才能使其工作。希望这可以帮助其他遇到此问题的人！
回答by Jesse Sierks
I had this issue with IE 11 on my development machine (but not elsewhere). My Internet Options were set to not allow Font downloads. Probably won't be common, as I'm on Windows Server, but if so try this to fix it:
我的开发机器上的 IE 11 有这个问题（但在其他地方没有）。我的 Internet 选项设置为不允许下载字体。可能不会很常见，因为我在 Windows Server 上，但如果是这样，请尝试修复它：
[Gear] >> Internet Options >> Security >> Custom Level >> Downloads >> Font Download >> Enable
[Gear] >> Internet 选项 >> 安全 >> 自定义级别 >> 下载 >> 字体下载 >> 启用
回答by naresh goyal
I have also faced same issue. In my case, below fix works :
我也遇到过同样的问题。就我而言，以下修复有效：
Firefox (and, to a lesser extent, Chrome and IE) has an issue where it fails to download the font and so doesn't display any of the icons correctly.
Firefox（以及在较小程度上，Chrome 和 IE）存在无法下载字体的问题，因此无法正确显示任何图标。
A very easy fix has been identified in a number of locations, cdnjs/cdnjs#755 being one of them.
已在多个位置确定了一个非常简单的修复方法，cdnjs/cdnjs#755 就是其中之一。
The fix is to add the following to the start of the font-awesome.css file (before the @font-family call):
修复方法是将以下内容添加到 font-awesome.css 文件的开头（在 @font-family 调用之前）：
Header set Access-Control-Allow-Origin "*"
标头集 Access-Control-Allow-Origin "*"
回答by Sreeram Nair
I faced the same Issue and I just added the following Link in the Tag and it worked.
我遇到了同样的问题，我只是在标签中添加了以下链接并且它起作用了。
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
Hope this helps!
希望这可以帮助！
回答by Nina
In my case it was a display: tableset on the element. Removing it resolved an issue.
在我的情况下，它是display: table元素上的一个集合。删除它解决了一个问题。
回答by Kickasstimus
Look into removing the version tags from the end of the files. Those tags cause IE to have fits.
查看从文件末尾删除版本标记。这些标签会导致 IE 匹配。
change this...
改变这个...
../fonts/fontawesome-webfont.eot?v=4.3.0'
to this...
到这...
../fonts/fontawesome-webfont.eot'
