实现跨浏览器的盒阴影效果

对于支持box-shadow属性的浏览器只要一层标签就可以搞定了，但是，如果要使用模糊滤镜实现IE浏览器下的盒阴影效果，需要借助一个“幕后”的标签，这是一个与主体标签同样大小的div，有着特定的背景色（取决于投影的颜色），以及模糊大小，由于与主体标签大小一致，现代浏览器不鸟IE私有的filter滤镜，所以，此“幕后”标签的存在对于Firefox、Chrome这类现代浏览器的UI表现几乎没有任何影响。

代码：

<style>
.baseBlock{
    position:relative;
}
.baseBlockIn{
    width:220px;
    height:220px;
    background:#a0b3d6;
    box-shadow:10px 10px 5px #444;
    -moz-box-shadow:10px 10px 5px #444;
    -webkit-box-shadow:10px 10px 5px #444;
    position:relative;
    z-index:1;
}
.ieShadow{
    _width:220px;
    _height:220px;
    filter:progid:DXImageTransform.Microsoft.Blur(pixelradius=18);
    -ms-filter:"progid:DXImageTransform.Microsoft.Blur(pixelradius=18)";
    background-color:#444\9;
    position:absolute;
    top:-8px;
    left:-8px;
}

</style>
<div class="baseBlock">
    <div class="baseBlockIn"></div>
    <div class="ieShadow"></div>
</div>