Question

我想制作单一的css规则，以模糊现代浏览器上的文字。

我有两条规则：

这个适用于gecko和webkit，但不适用于IE11：

<span style="color: rgba(0, 0, 0, 0); text-shadow: 0 0 .4em rgba(0,0,0,1);">
Example text
</span>

这适用于IE10 +，但不适用于webkit或gecko：

<span style="color: rgba(0, 0, 0, .01); text-shadow: 0 0 .4em 0.1em rgba(0,0,0, 0.4);">
Example text
</span>

我认为有一个IE11错误/功能可以阻止文本阴影显示颜色是否透明。 IE需要额外的，必要的（这个效果起作用）参数。

这是JSfiddle：http://jsfiddle.net/WWTQn

Answer 1

为什么不用单个css类同时拥有这两个规则？

的CSS：

.blur{
    color: rgba(0, 0, 0, .01); text-shadow: 0 0 .4em 0.1em rgba(0,0,0, 0.4);
    color: rgba(0, 0, 0, 0); text-shadow: 0 0 .4em rgba(0,0,0,1);
}

HTML：

<span class="blur">
    Example Text
</span>

像这样： http://jsfiddle.net/STm6T/

在webkit，gecko和IE10 +上使用text-shadow css模糊文本

1 个答案: