Javascript 跨浏览器文本（模糊）阴影

如何获得跨浏览器文本（模糊）阴影？包括IE6，7，8

有没有css或js解决方案

我想获得带有语义和有效标记的文本阴影。

jQuery可以处理这个问题。

---

要获得完全的浏览器兼容性，您必须使用JavaScript，没有纯CSS解决方案。

这种方法使用定位的

span

来实现外观

可能存在使用转换的纯css解决方案

使用过滤器：

IE 6支持过滤器，因此您可以使用：

filter: dropshadow(color=#ffff00,offX=5,offY=5);

因此，跨浏览器样式可能如下所示：

.my-class 
{
    -ms-filter: "dropshadow(color=#ffff00,offX=5,offY=5)";
    filter: dropshadow(color=#ffff00,offX=5,offY=5);
    text-shadow: #ff0 5px 5px;
}

这将向您展示如何创建文本模糊效果以及其他几种文本效果

<div id="blurred">BLURRED</div>

blurred {
    text-shadow: 0px 0px 10px rgba(255,255,255,0.4),
    0px 0px 30px rgba(255,255,255,0.6),
    0px 0px 50px rgba(255,255,255,0.5),
    0px 0px 180px rgba(255,255,255,0.5);
    color: rgba(255,255,255,0);
}

对于较新版本的IE，您可以指定它们与此元值的IE9兼容性

<meta http-equiv="X-UA-Compatible" content="IE=9" />

这是一个解决方案，但ie dropshadow过滤器实在是太难看了，我宁愿把眼睛挖出来也不愿使用它。

<meta http-equiv="X-UA-Compatible" content="IE=9" />