兼容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 许可协议。转载请注明出处!