所以我正在使用 Font Awesome在元素和测试中，我遇到了 IE8 问题。
在 Windows IE9 上，Chrome 和 Firefox 可以正确显示字体(OS X 上的 Firefox、Chrome 和 Safari 也是如此)但是 Windows 上的 IE8 有一个问题，我用一个框代替了字体。
我的代码是:
<!DOCTYPE html>
<!--[if lt IE 7 ]><html class="ie ie6" lang="en"> <![endif]-->
<!--[if IE 7 ]><html class="ie ie7" lang="en"> <![endif]-->
<!--[if IE 8 ]><html class="ie ie8" lang="en"> <![endif]-->
<!--[if (gte IE 9)|!(IE)]><!--><html lang="en"> <!--<![endif]-->
<head>
<meta charset="utf-8" />
<title>Site title</title>
<!--[if lt IE 9]>
<script src="https://html5shim.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
<link href=".../css/css.css" rel="stylesheet" type="text/css">
<link href="../css/print.css" rel="stylesheet" type="text/css" media="print">
<link href="../apple-touch-icon.png" rel="apple-touch-icon-precomposed">
<link href="../css/jquery-ui-1.8.23.custom.css" rel="stylesheet" type="text/css">
<link href="../css/jquery-ui-overrider.css" rel="stylesheet" type="text/css">
<link href="https://fonts.googleapis.com/css?family=Lato|Michroma&subset=latin&v2" rel="stylesheet" type="text/css">
<link href="../css/prettify.css" rel="stylesheet" type="text/css">
<link href="../css/font-awesome.css" rel="stylesheet" type="text/css">
<!--[if IE 7]>
<link href="../css/font-awesome-ie7.css" rel="stylesheet">
<![endif]-->
我有四个字体文件...
- fontawesome-webfont.eot
- fontawesome-webfont.svg
- fontawesome-webfont.ttf
- fontawesome-webfont.woff
...它们所属的位置并且全世界都可以读取它们(755 权限)。 我错过了什么？我必须在 IE8 中使用兼容性 View 做些什么吗？
同一台计算机可以正常查看 Font Awesome 网站上的字体，所以一定是我做错了什么。
应要求，此处提供了 font-awesome.css 的副本:font-awesome.css .除了字体文件的路径外，它或多或少是我从他们那里下载的。
基于@Abody97 我添加了https://html5shim.googlecode.com/svn/trunk/html5.js混合(上面的代码已更新)。仍然没有运气，即使在刷新和删除缓存刷新之后也是如此。
最佳答案
我遇到了同样的问题并找到了解决方案，我会把它贴在这里以防有人需要它。
问题是 IE 无法加载字体文件，它正在构建返回 404 错误的奇怪 GET 请求。
使用此处找到的技巧:http://www.fontspring.com/blog/fixing-ie9-font-face-problems我能够解决这个问题。
将 ?#iefix 添加到包含字体的 CSS 中的 eot url(在本例中为 font-awesome.css)
@font-face {
font-family: 'MyWebFont';
src: url('webfont.eot'); /* IE9 Compat Modes */
src: url('webfont.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
url('webfont.woff') format('woff'), /* Modern Browsers */
url('webfont.ttf') format('truetype'), /* Safari, Android, iOS */
url('webfont.svg#svgFontName') format('svg'); /* Legacy iOS */
}
关于css - Font Awesome 字体在 IE8 上显示为框，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/12130323/