IE: 问题 :( 不正确的 webfont 显示答案

【问题标题】：IE: Issues :( incorrect webfont displayIE: 问题 :( 不正确的 webfont 显示
【发布时间】：2012-09-24 04:25:19
【问题描述】：

大家好！ 所以我在为朋友编写的这个网站上遇到了几个奇怪的仅限 IE 的错误。

我使用的是 Google Webfont Raleway，字体大小：300,400,700,900。但是 IE 将所有字体粗细更改为 300，并且不使用任何其他字体。

感谢所有提示和反馈！

主要导航字体样式：

.nav_li { 
    float:left;
    margin: 0;
    list-style-type:none; 
    font-family: 'Raleway', sans-serif;
    font-weight: 700;
    line-height: 100px;
    color: #fff;
    cursor: pointer;
    -webkit-transition: background .5s; -moz-transition: background .5s; -ms-transition: background .5s; transition: background .5s;
}

附上截图：

【问题讨论】：

我要说这是某种缓存问题。我在任何浏览器（包括 Internet Explorer）中都没有遇到该网站的问题。它们看起来几乎一模一样。 IE是什么版本的？
我有IE9，但是当我使用IE7和8文档模式时，它看起来像300版本的字体。我在 Windows 7 上，刚刚清除了我的 IE 缓存并且字体没有更新。
@David 您在 IE 中说它看起来不错？我刚刚注意到我的：CSS3117: font-face failed cross-origin request。资源访问受到限制。
我觉得它看起来不错，但后来我意识到我看错了部分，哈哈，之后我看到了导航的不同。
IE 出现“问题”是正常的，也是意料之中的。

标签： html css internet-explorer cross-browser webfonts

【解决方案1】：

这样的问题在 IE 中并不少见：一些谷歌字体，当按照谷歌推荐的方式使用时（指谷歌服务器上的代码），只是由于访问限制而失败。避免这种情况的方法是下载字体（使用“下载您的收藏”链接），使用FontSquirrel 处理它们，将它们上传到您的服务器（与托管您的 HTML 文档相同），并使用 CSS @font-face 代码（由 FontSquirrel 直接给出）。

【讨论】：

【解决方案2】：

我认为知道这是 Internet Explorer 的问题。

http://help.typekit.com/customer/portal/articles/6855-using-multiple-weights-and-styles

每个字体最多可以有 4 个字体粗细（你可以接受），但如果你阅读了那篇文章，IE 也会有字体粗细的其他错误。

希望它有所帮助:-)。

【讨论】：

感谢您现在查看！哦，我的图像问题已解决，jpg 格式不好，可能是因为它是在我的 Mac 上开始的
我把它降低到只有 3 个字体粗细，但它仍然不起作用，我认为我的问题是 Web 服务器，因为我在 IE 中遇到了字体失败的跨域请求错误。 Ruda 字体工作正常，所以我想我会在仅 ie 的 css 文件中使用它。不过谢谢，那个链接很有帮助！

【解决方案3】：

根据 Google 的技术考虑

更一般地说，Internet Explorer 的行为可能会因各种元素的位置和存在而异。如果您想在所有浏览器中提供一致的行为，请使用 WebFont Loader。例如，您可以选择让所有浏览器的行为都像 Firefox。

https://developers.google.com/webfonts/docs/webfont_loader

【讨论】：

谢谢，我只是试了一下没有用，我相信我的问题是由于网络主机/跨域请求错误造成的，我不想只为 IE 努力修复：/如果您使用 IE8 或 7，请改用 Ruda 并制作我的请升级到现代浏览器页面呵呵
当然。这是一个好主意。我个人根本不关心 IE 用户。