我有一个关于 Google 字体的问题。我正在使用来自Google Fonts 的字体“Lato”，它似乎在 Firefox、Chrome、IE9 中运行良好，但在 IE 7 和 8 中，斜体版本看起来确实被拉伸了。
我并没有做任何太疯狂的事情，只是使用
font-style:italic; font-weight:700;
并包括使用的字体：
<link href='http://fonts.googleapis.com/css?family=Lato:400,700,700italic,900italic' rel='stylesheet' type='text/css'>
这是 Google 字体的已知问题还是我做错了什么？
谢谢！
【问题讨论】：
标签： css internet-explorer fonts
这是一个老问题，但我在谷歌上搜索了一个小时来为 IE8 中的这种仿粗体和仿斜体找到一个简单的解决方法。 这对我有用： 我不是一次加载所有字体，而是一一加载。我更喜欢 css 文件中的 @import 方法，所以它是这样的：
@import url(http://fonts.googleapis.com/css?family=Open+Sans:300italic);
@import url(http://fonts.googleapis.com/css?family=Open+Sans:400italic);
@import url(http://fonts.googleapis.com/css?family=Open+Sans:400);
@import url(http://fonts.googleapis.com/css?family=Open+Sans:600);
【讨论】：
无论出于何种原因（也许有人可以帮助解释原因），Google 决定不向 IE 用户提供除常规字体之外的任何字体变体。此行为似乎由用户代理控制 - 如果您在 Firefox 和 IE 中加载 CSS url（在您的情况下为 http://fonts.googleapis.com/css?family=Lato:400,700,700italic,900italic），您会看到只有一个 @font-face 块返回到 IE。
因此，解决此问题的最简单方法是在 Firefox 中加载该 url 并将 CSS 复制/粘贴到您自己的 css 文件中，而不是直接从 Google 提供。现在 IE 也可以访问所有字体变体......但从技术上讲，您正在破坏 CSS 文件和底层字体文件之间的链接，应该永远不会改变，但这完全取决于 Google 的判断.
不幸的是（可能是他们推理的一部分），即使在那时，IE 也不能很好地呈现字体。在我的测试中，半粗体显示的粗体比它应该的粗体，斜体似乎间隔太远了。至少，它看起来仍然比没有额外变体的 IE 呈现的仿斜体倾斜字体更令人愉悦。
编辑：
经过更多研究，我发现了一个很棒的页面on Typekit，它详尽地记录了这个问题。基本上，IE 在自定义字体系列方面非常有限 - 您能够使用 IE 取得成功的唯一方法是将您的变体定义为 IE 中的单独字体系列，然后使用那些不同的字体你会在其他浏览器中使用font-weight 和font-style。这应该为您提供通用兼容性。
edit2：事实证明 IE 字体的 url 与其他浏览器的不同（IE 使用 eot 格式而不是 woff）。如何让这个为你的字体工作的详尽过程如下：
font-style 和 font-weight 属性应该匹配）并将 woff src url 替换为 IE 的 eot 。还要给字体一个不同的系列——我建议像 Typekit 那样使用样式和粗细作为后缀，这样 Open Sans 就变成了 Open Sans i9 等等。 font-style 或font-weight 的位置，添加font-family，引用新的姓氏和其他浏览器看到的正确姓氏。例如：font-family: 'Open Sans i9', 'Open Sans'; font-weight: 900; font-style: italic;。这将使用字体系列名称以实现 IE 兼容性，以及其他浏览器中的基本系列 + 变体。【讨论】：
这两个示例显示的斜体字体不同。我猜 IE7/8 是人为斜体的。我进一步猜测这是因为字体粗细与字体文件中的实际粗细不匹配；尝试使用 500 的重量。
【讨论】：