div{
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:
div{
position:absolute; padding:5px; line-height:20px; width:500px; border:#FF962D 2px solid;
background:#FFFFFB; z-index:2;
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*/
}
HTML:
<div>内容</div>
说明:为了更好兼容各个浏览器,还是建议使用多层DIV或是背景图片来实现。
下一篇:css之background背景颜色与背景图片属性详解
讨论数量:0