问题详情:
我遇到的问题是 Internet Explorer 10(在 Windows 7 - 64 位下)不加载在 CSS 中嵌入 @font-face
的字体。相反,它显示“Arial”或类似的字体。我已经在多个设备上测试过这个问题:
- Windows 8 和 Internet Explorer 11(64 位)
- Windows 8 和 Internet Explorer 10(64 位)
- Windows 7 和 Internet Explorer 10(64 位)
但对我来说,这个问题从未发生过。但奇怪的是,这个问题出现在安装了 Internet Explorer 10 和 Windows 7 64 位的客户 PC 上。
另一个奇怪的是,在Internet Explorer 的“网络”选项卡中显示所有资源,但IE 不会显示任何字体。 幸运的是,我有一台客户 PC 来调试这个问题。我还没弄清楚问题出在哪里。
我已经做了什么来找到解决方案:
我已确保路径和
font-family
名称是正确的。我还确保@font-face
命令在我嵌入的 CSS 文件中我尝试从以下位置添加文档类型:
<!DOCTYPE html> to <!DOCTYPE html SYSTEM "about:legacy-compat">
我更新了元标记,例如:
<meta http-equiv="X-UA-Compatible" content="IE=edge">
我还尝试更改 font-face
url
命令的顺序我从
font-family
的名称中删除了'
,因此来自:font-family: 'My font'; to font-family: My font;
我还尝试使用
.htaccess
文件强制使用正确的字体 MIME,例如:AddType application/vnd.ms-fontobject .eot AddType application/x-font-opentype .otf AddType image/svg+xml .svg AddType application/x-font-ttf .ttf AddType application/x-woff .woff
我还在另一台服务器上安装了该网站,以确保这不是服务器问题
我确保未选中“Internet 选项”->“辅助功能”下 Internet Explorer 10 中的复选框
技术方面的东西:
我将我的 CSS 嵌入到:
<link rel="stylesheet" type="text/css" href="assets/css/base.css">
我的@font-face
命令看起来像:
@font-face {
font-family: MyFont;
src: url('myPath/MyFont.eot');
src: url('myPath/MyFont.eot?#iefix') format('embedded-opentype'),
url('myPath/MyFont.woff') format('woff'),
url('myPath/MyFont.ttf') format('truetype'),
url('myPath/MyFont.svg#myfont') format('svg');
font-style: normal;
font-weight : normal;
}
//编辑: 我只想指出 CSS 字体通常可以正常工作。但不幸的是不在这个网站上。
最佳答案
让@font-face 在 Internet Explorer 中工作可能就够吓人的了。 正如你所知,@font-face 已经通过 WebKit 在 Safari 3 中工作,并在最新的 Firefox 3.1 beta 中得到支持。 使用 IE,这意味着如果 EULA 允许的话,全局大约 75% 的观众现在可以看到自定义字体。 幸运的是,我们已经可以使用很好的免费面孔,以及一些允许嵌入的商业面孔。 所以..我的洋葱使用最新版本的浏览器,如 chrome、firefox 3.1、safari 3。 谢谢……
关于html - Windows 7 上的 Internet Explorer 10 不加载嵌入字体,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/26758394/