IE 文本在渐变上渲染答案

【问题标题】：IE Text Rendering Over a GradientIE 文本在渐变上渲染
【发布时间】：2011-05-28 20:56:18
【问题描述】：

如果文本位于任何应用了“过滤器”的元素上，IE 8 和更低版本的文本会非常糟糕。没有什么真正令人惊讶的。我通常只是避免使用“过滤器”。但是，我在 IE9 中进行了一些测试，发现了一个巨大的问题；在应用了 css3 渐变或框阴影的任何元素上呈现的文本，文本呈现被破坏。不仅针对直接位于元素顶部的文本，还针对 z-index 中渐变上方的每个元素。例如，如果我用渐变定义页面的背景，用纯白色 div 覆盖它，然后在上面渲染文本，它仍然很糟糕。我真的希望这只是一个测试版问题，将在最终版本中解决。我一直在使用代码here 来处理渐变（减去过滤器），但现在在 IE9 中，所有使用这种技术的页面看起来都很糟糕。有谁知道这件事 - 我在谷歌上搜索时找不到关于这个问题的任何信息。

【问题讨论】：

微软对于将错误列表保密非常挑剔，尤其是对于 beta 项目。话虽如此，我还没有看到任何东西，但只有一个版本才能回答这个问题。
交叉手指 当我创建一个可能很棒的网站时，我讨厌它，而客户在 IE 中查看它并询问为什么文本渲染很糟糕。我希望那时我可以将其归咎于 IE，但归咎于一个无关紧要的客户。
见：stackoverflow.com/questions/9156731/… 和 stackoverflow.com/questions/2503920/…
共识是优雅的降级 - 为旧的 IE 或背景图像使用纯色 - 让新的 IE 获得新的（ish）闪亮。
IE creates font-icon strange underline的可能重复

标签： internet-explorer filter css internet-explorer-9 text-rendering

【解决方案1】：

IE 演示：-

http://samples.msdn.microsoft.com/workshop/samples/author/filter/gradient.htm

语法 HTML

<ELEMENT STYLE=
"filter:progid:DXImageTransform.Microsoft.Gradient(sProperties)" ... >

Internet Explorer 5.5 或更高版本例如：-

<DIV STYLE="width:100%; filter:
    progid:DXImageTransform.Microsoft.MotionBlur(strength=13, direction=310)
    progid:DXImageTransform.Microsoft.Blur(pixelradius=2)
    progid:DXImageTransform.Microsoft.Wheel(duration=3);">
        Blurry text with smudge of gray.</div>

启用了布尔属性，可以设置为false或truehttp://msdn.microsoft.com/en-us/library/ms532997%28v=vs.85%29.aspx

CSS gradients in IE7 & IE8 is causing text to become aliased

例子：

-ms-filter: "progid:DXImageTransform.Microsoft.gradient(enabled=false)";

【讨论】：

【解决方案2】：

四年后，我认为可以肯定地说这是一个测试版问题。

在 IE 8 中打开示例，除了在 Windows XP 等平台上的 IE 8 中总是糟糕的抗锯齿功能之外，没有明显的问题。

很多东西都变了。

【讨论】：