Html阴影box-shadow多个兼容方式,box-shadow透明度如何设置？

Html阴影box-shadow多个兼容方式,box-shadow透明度如何设置？

原文地址:https://www.toymoban.com/diary/share/98.html

阴影 box-shadow 多个兼容方式

---

不同浏览器的兼容方式如下：

.box_shadow{
    background-color: #eee;
    filter: progid:DXImageTransform.Microsoft.Shadow(color='#969696', Direction=135, Strength=5);/*for ie6,7,8*/ 
    -moz-box-shadow:2px 2px 5px #969696;/*firefox*/ 
    -webkit-box-shadow:2px 2px 5px #969696;/*webkit*/ 
    box-shadow:2px 2px 5px #969696;/*opera或ie9*/
    behavior: url(PIE.htc);/*IE8*/
}

注：IE8下支持。使用 PIE.HTC 插件 点击下载

透明度设置方式如下：

使用 rgba

.box_shadow {
    box-shadow:0 4px 4px rgba(0, 0, 0, 0.4);
}

box-shadow 使用说明

box-shadow : 0px 1px 2px rgba(0, 0, 0, 0.4);

0px 表示阴影的 x 坐标

1px 表示阴影的 y 坐标

2px 表示阴影的模糊程度

rgba(0, 0, 0, 0.4) 后面表示阴影的颜色