首页 诗词 字典 板报 句子 名言 友答 励志 学校 网站地图
当前位置: 首页 > 教程频道 > 网站开发 > CSS >

CSS实现跨浏览器兼容性的盒影子效果

2013-09-11 
CSS实现跨浏览器兼容性的盒阴影效果在web页面的ui表现中,投影效果可以说是非常常见的一种表现效果了。对于

CSS实现跨浏览器兼容性的盒阴影效果
在web页面的ui表现中,投影效果可以说是非常常见的一种表现效果了。

对于目前对CSS3支持如狗屎的孤芳自赏的IE浏览器怎么办呢?box-shadow属性对于IE浏览器就像是圣诞树上的彩灯——装饰而已。
好在IE浏览器有个IE shadow滤镜,是IE浏览器私有的一个东西,可以模拟还凑合的盒阴影效果,使用类似于下面的代码:

.shadow {    -moz-box-shadow: 3px 3px 4px #000;    -webkit-box-shadow: 3px 3px 4px #000;    box-shadow: 3px 3px 4px #000;    /* For IE 8 */    -ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#000000')";    /* For IE 5.5 - 7 */    filter: progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#000000');}


浏览器支持情况

    Firefox 3.5+
    Safari 3+
    Google Chrome
    Opera 10.50
    Internet Explorer 5.5

热点排行