Question

[原标题： IE 9文字渲染效果很差;有解决方法吗？）

IE 9正在渲染我的应用程序中的文本非常糟糕。问题不在我的显示器的清除类型设置中，因为兼容模式下的IE 9，Firefox和Chrome都能很好地呈现文本。以下是对IE 9，兼容模式下IE 9和Chrome的文本呈现方式的并排比较：

IE 9

IE 9 Compatibility Mode

enter image description here

我尝试应用this answer，但它似乎不适用于IE 7之后的任何内容。有人知道我们可以应用于我们的网站修复IE 9的错误文本呈现的任何变通方法吗？

修改

我已将问题页面简化为最基本的要点。正如您所看到的，重现并不需要太多。如果IE9和IE9标准的文档模式，请确保IE具有浏览器模式：

<html xmlns="http://www.w3.org/1999/xhtml">
  <body style="background-color: rgb(30, 34, 59); color: rgb(255, 85, 0); font-size: 20px">
    Home
  </body>
</html>

Answer 1

简短回答：当您在 pt （点）中指定字体大小时，这是一个问题，而不是像素。

所以会发生新的IE9渲染引擎使用DirectWrite，它不会像使用GDI +那样捕捉到最近的像素，所以如果你的pt大小没有映射到整个像素数，它会绘制它正是这样，这使它显得模糊。

IE8兼容模式不会遇到这个问题，因为它使用我们习惯的常规GDI渲染。

因此，请查看所有样式表等，如果您要求的是字体大小的字体，那将是IE9中给出的内容，并且根据您使用的字体等，您的磅值可能会也可能不会映射到清晰的尺寸清晰。

这里有详细解释：

IE9's blurry font text - www.hanselman.com/blog/TheUltimateGuideOfFiveThingsForNewIE9UsersWhoFearChange.aspx

Answer 2

似乎在opacity:.9999上设置body会使IE9标准模式下的文本与Quirks模式中的文本更相似。

Answer 3

标准模式下的IE9使用文本的子像素寻址。可以说它“平滑”文本字符，或者你可以说相反，即它“模糊”字符。这基本上是一回事。

我个人认为你的三幅影像之间没有任何容易察觉的差异，实际上更喜欢第一幅。但是，这取决于个人喜好。

我在网上搜索了一下，似乎没有办法清除关闭IE9上的子像素渲染。您可能会对此链接感兴趣：Disable Cleartype (text anti-aliasing) in IE9

在WPF中，可以选择关闭子像素字体渲染并强制字母“捕捉到像素”。但IE9似乎没有这样的转换。

但是，我的建议是：你首先要做的是一个很大的问题吗？如果子像素文本渲染在您的网站上为您提供非常难看的输出（您使用了很多非常小的类型？），您可能需要首先重新考虑您的网站布局。类型太小，以至于在网站中最好避免使用子像素渲染使它们不清楚。

并不知道其他浏览器将来会在文本中添加子像素渲染 - 实际上FF4已经使用了Direct2D，但可能没有使用DirectWrite。

Answer 4

Internet Explorer 9似乎在真正随机的条件下停止使用子像素抗锯齿。例如，这是触发它的另一个例子（我假设还有更多）：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3c.org/TR/1999/REC-html401-19991224/loose.dtd">
<HTML><HEAD>
<TITLE></TITLE>
<BODY>
Outside the div - with sub-pixel AA. :)
<div style="border-radius: 1px; overflow: hidden;">
Inside the div - no sub-pixel AA. :(
</div>
</BODY></HTML>

div中的文本不会使用子像素（“彩色”）消除锯齿进行渲染，但其外部的文本将会出现。 <{1}}和border-radius声明都是触发错误所必需的。

（有人可以试试，如果它在他们的系统上发生并发表评论吗？我有兴趣知道这个错误是否仅在某些系统配置上被触发。）

如果您将IE Developer Tools中的文档模式切换为“IE9标准”以外的任何内容，则问题将消失。

我个人几乎愿意和它一起生活，但是如果它真的困扰你我会建议逐步删除你的样式表来追踪触发它的原因。

Answer 5

我能让字体看起来很好的唯一方法是通过以下方式回归到IE8功能：

<meta http-equiv="x-ua-compatible" content="IE=8" />

已安装Microsoft更新http://support.microsoft.com/kb/2545698，我已使用font-size: 11px;

opacity:.9999解决方案比没有好，但没有IE8模式显示的好。

Answer 6

ClearType字体渲染用于所有IE9文档模式;子像素定位仅在IE9中使用默认标准模式。 IE9的兼容模式 - Quirks，7和 8个使用全像素文字指标。

因此，请尝试切换您的doctype以使用Quirks mode：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

或

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">

或其中一种兼容模式。

来自MSDN的更多信息

Answer 7

如果你需要使用IE，你就讨厌在这张图片上进行平滑处理 http://i.stack.imgur.com/SViG0.png 尝试打开兼容性视图（ALT + T以显示工具菜单）

IE 9在某些条件下不使用子像素抗锯齿

7 个答案:

来自MSDN的更多信息