Question

我正在使用以下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，但这会导致其他一些渲染问题，我希望还有另一种方法。

Answer 1

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

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

我通常做的是，我只使用标准css来提高透明度，例如rgba（）颜色，不透明度等等。在IE特定的CSS中，我将背景/文本颜色设置为近似匹配它看起来如何真正透明。

对于图像，我创建了一个透明的图像精灵的IE特定副本。但透明的png会导致ie7和更老的相同问题，所以我通常会在ie7.css中回到完全不透明（即不透明）

在IE7 / 8中，文本在透明背景上没有消除别名

1 个答案: