我没有做任何太疯狂只是使用
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 Fonts的已知问题,还是我做错了?
谢谢!
解决方法
所以,最简单的方法是在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).如何使您的字体工作的详尽过程如下:
>在firefox / chrome / etc中打开http://fonts.googleapis.com/css?family=Lato:900italic以获得超大的斜体变体.>在新样式表中找到匹配的变体(font-style和font-weight属性应该匹配),并将woff src url替换为IE的eot.还给字体一个不同的家庭 – 我推荐后缀的风格和重量像Typekit做,所以Open Sans变成Open Sans i9等等.>为所有剩余的变体做这个.>有条件地包括这个新的样式表,代替您已经在其他浏览器上使用的样式表.>无论您在css中使用了font-style或font-weight,还可以添加一个font-family,引用新的姓氏和其他浏览器所看到的正确的姓氏.例如:font-family:’Open Sans i9′,’Open Sans’; font-weight:900; font-style:italic ;.这将使用字体系列名称进行IE兼容性,其他浏览器中使用基本系列变体.