IE9：Arial字体渲染错误（加粗）

Question

3

我已经在Chrome、FF和IE8中测试了我的页面，所有的浏览器都以这种方式呈现文本：

图片描述

它被定义为：

font-family: 'Arial', sans-serif;
font-size: 0.75em;  
font-weight: bold;

我尝试了以不同的方式声明Arial字体，使用px代替em，并且也用数字（600、800）定义了字重…但是IE9仍然比其他浏览器呈现出更“粗”的效果：

在此输入图片描述

有什么帮助吗？谢谢

- pistacchio

5个回答

5

这个问题在StackOverflow上已经回答过了。这是一个浏览器问题，IE9呈现字体不同。它使用一种称为DirectWrite的ClearType技术。

我个人认为，这不是一个大问题。网站在每个浏览器中看起来都不完全相似。如果这真的困扰你，可以添加IE-Hacks（例如强制浏览器使用IE8渲染），但我不建议这样做。

- aebersold

1

http://www.dowebsitesneedtolookexactlythesameineverybrowser.com/ - Simon West

1

我并不想实现“到处看起来都一样”的效果，但更加粗体的文本会给出更广泛的内容，在我的情况下，这不仅仅是看起来不同，而是完全错误的。 - pistacchio

4

只是为了参与讨论，你可以在你的HTML中加入一个meta标签作为快速解决方法，告诉IE9模仿IE8，以恢复原始渲染。

要实现这一点，在您的 <head> 中加入<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE8" />。

然而，这将牺牲其他您可能需要的IE9功能，比如更好的HTML5和CSS3支持。

- shauneba

那个答案真的很有帮助 +1 - Nicholaz

1

一般来说，IE 经常让我头疼。我的做法是使用条件 CSS，并从 IE 的 CSS 中删除粗体。

<!--[if IE 9]>
    <link rel="stylesheet" type="text/css" href="/ie9.css" />
<![endif]-->

然后像这样定义它

font-family: 'Arial', sans-serif;
font-size: 0.75em;

- Federico Giust

0

我在设置了body标签的font-weight:bold时遇到了这个问题。不知何故，IE9渲染出来的Arial文本比其他浏览器更加粗体。

- SurinderBhomra

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- David Kolar · Accepted Answer

您可能遇到了不同的问题，因为您说您尝试了一个重量为600的字体，但通常情况下，当您告诉IE 9将Arial呈现为粗体时，您最终看到的不是Arial，而是Arial Black。这种切换会在800和900的font-weight中发生。

要在IE 9中使用粗体Arial而不切换到Arial Black，请使用...

font-family: Arial, sans-serif;
font-size: 0.75em;  
font-weight: 700;

这也应该解决Firefox中相同的问题。