使用css实现div的阴影效果

            用CSS实现div边框的阴影(兼容各大浏览器),在网上很多时候,我们都能看到很多阴影的效果,看着很是绚丽,今天在http://www.lzklog.com/博客上看了能够兼容的文章,自己照着上面弄了一下,做出一个实例,可以参考着,在以后的设计中可以使用,还是不错的效果。

           实现:

           输入代码:

 





亲,欢迎您来到藏章博客!~



 相关说明:

对于 ie: direction 阴影角度 0°为从下往上 顺时针方向 strength 阴影段长度

-moz-box-shadow: 2px 5px 10px #46B7D4;

-webkit-box-shadow: 2px 5px 10px #46B7D4;

 box-shadow:2px 5px 10px #46B7D4;

第一个参数是x轴阴影段长度

 第二个参数是y轴阴影段长度

第三个参数是往四周阴影段长度

第四个参数是阴影段颜色

效果截图:

演示地址:http://www.cangzhang.com/wp-content/uploads/2012/09/index.html

共有 7 条评论

Top