css - 文本在 IE7/8 中的透明背景上不抗锯齿

标签 css internet-explorer-8 transparency antialiasing

示例:http://jsfiddle.net/NBWmU/1/

我正在使用以下 CSS 使我的 div 背景在尽可能多的浏览器中透明:

background: rgb(255, 255, 255) transparent;
background: rgba(255, 255, 255, 0.6);
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#99FFFFFF, endColorstr=#99FFFFFF);
-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#99FFFFFF, endColorstr=#99FFFFFF)";

出于某种原因,在 IE8 中,透明 div 顶部的文本显得清晰且像素化,并且与普通背景上 div 外部的相同文本看起来完全不同。我还没有在其他浏览器中测试过。

有人知道我可以强制文本在任何地方呈现相同的方法吗?我试过使用透明的 png,但这导致了一些其他的渲染问题,我希望有另一种方法。

最佳答案

是的:不要使用 -ms-filter 和 filter:progid:DXImageTransform 等。

过滤器的实现中存在一个错误,导致它使用后备文本呈现器。使其保持一致的唯一方法是在涉及文本时不使用它,或者在所有文本上使用它(这样所有文本都同样丑陋和像素化)。

我通常做的是,我只使用标准的 css 来实现透明度,例如 rgba() 颜色、不透明度等。在 IE 特定的 css 中,我将背景/文本颜色设置为与它的外观近似匹配真正的透明度。

对于图像,我创建了一个透明的图像 Sprite 的 IE 特定副本。但是透明的 png 在 ie7 和更早的版本中会导致同样的问题,所以我通常在 ie7.css 中退回到完全不透明(即不透明)

关于css - 文本在 IE7/8 中的透明背景上不抗锯齿,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/6407840/

相关文章:

internet-explorer-8 - PIE.htc 圆 Angular 在 IE8 中不起作用

html - 为什么我在 IE8 上用这个 CSS 看不到这个图像按钮?

css - 只使用 CSS,我可以只使用 PNG 的 alpha channel 吗?

java - 在 SWT 上具有透明度的 PNG 图像

javascript - 将页脚粘贴到页面底部

jquery - 如何在 HTML5 和 CSS3 中创建类似 Circles 的菜单?

Javascript 日期在 ie8 中显示 nan

C# Winforms 透明控件允许点击

css - 使用 div 定义 CSS 属性

javascript - 任何人都可以解释为什么这个 jQuery.offset() 每次使用时都会发生变化吗?