兼容ie7-10，chrome，firefox边框阴影效果

<div class="mydiv"> TEXT TEXT TEXT </div>

<style type="text/css">
.mydiv{
width:220px;height:auto;padding:5px;border:#909090 1px solid;background:#fff;color:#333;
filter:progid:DXImageTransform.Microsoft.Shadow(color=#909090,direction=120,strength=4);/*ie*/
-moz-box-shadow: 2px 2px 10px #909090;/*firefox*/
-webkit-box-shadow: 2px 2px 10px #909090;/*safari或chrome*/
box-shadow:2px 2px 10px #909090;/*opera或ie9*/
}
</style>

参数说明：

filter:progid:DXImageTransform.Microsoft.Shadow(color=#909090,direction=120,strength=4);/*ie*/

direction ：阴影角度 0°为从下往上 顺时针方向

strength 阴影段长度

-moz-box-shadow: 2px 2px 10px #909090;/*firefox*/

-moz-box-shadow ： (x轴阴影段长度)  (y轴阴影段长度) (往四周阴影段长度) (阴影段颜色)  

本文作者： Jasmine

本文链接： https://www.jianbaizhan.com/article/294

版权声明： 本博客所有文章除特别声明外，均采用 CC BY-NC-SA 3.0 许可协议。转载请注明出处！