1

RGBA - IE 的解决方法是“DXImageTransform.Microsoft.gradient”。找到 www.css3please.com 提供的用于跨浏览器透明度的便捷工具,但在 IE(IE8)上应用此渐变 - 有效,但文本失去了清晰度/易读性。

申请georgia使字体在所有浏览器上看起来一致,但是在我应用渐变后文本没有正确显示。这是 JSFiddle http://jsfiddle.net/mvivekc/GJaDy

代码是——

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<meta http-equiv="X-UA-Compatible" content="IE=9" />
<html>
<style type="text/css">
.georgiaWithTransform{
    font-family: Georgia;
    height: 80px;
    width: 800px;
     font-family: "Georgia", Geneva  ;
    word-wrap:break-word;
      background-color: rgba(150, 150, 150, 0.3);  /* FF3+, Saf3+, Opera 10.10+, Chrome, IE9 */
                filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#4C969696,endColorstr=#4C969696); /* IE6–IE9 */
                zoom: 1;

 }
 .georgiaWithoutTransform{
    font-family: Georgia;
    margin-top: 30px;
    height: 80px;
    width: 800px;
     font-family: "Georgia", Geneva  ;
word-wrap:break-word;
  background-color: rgba(150, 150, 150, 0.3);  /* FF3+, Saf3+, Opera 10.10+, Chrome, IE9 */

 }
</style>
<body>
<div class="georgiaWithTransform">Georgia does not appear properly with transformation in IE 8,and i do not understand why this is happening</div>
<div class="georgiaWithoutTransform">Georgia properly without transformation in IE 8,You can notice the difference in the appearance of the text here as compared to the top part( Noticeable only in IE)</div>
</body>
</html>

无法理解为什么会发生这种情况,并且非常需要解决此问题的方法。

这是IE8上问题的屏幕截图- 在此处输入图像描述

同样的情况也发生在小提琴上..问题只在 IE 上看到,不知道为什么..

请帮助,在此先感谢

4

2 回答 2

0

我曾经在 IE 中使用不透明度过滤器时遇到过类似的问题,向我建议的替代方法是使用 2x2 图像和背景重复。在您的情况下,您可以尝试使用 1px 宽度和内容高度作为图像的高度,并应用所需的渐变。这可能对您没有多大帮助,但这里是上述问题的链接。

PS:使用图像作为解决方法对我来说确实很有魅力。

IE过滤器抗锯齿问题

于 2012-02-06T10:30:28.923 回答
0

好吧,这就是我认为正在发生的事情。过滤器关闭字体中的抗锯齿。您可以在此处查看提供的解决方案。Biziclop 创建了一个您可以使用的小型 jQuery 脚本,并在此处提供了一个示例。这将迫使浏览器伪造抗锯齿。

于 2012-02-07T14:10:41.657 回答