box-shadow

外阴影：box-shadow: X轴  Y轴  Rpx  color;

属性说明（顺序依次对应）： 阴影的X轴(可以使用负值)    阴影的Y轴(可以使用负值)    阴影模糊值（大小）    阴影的颜色

内阴影：box-shadow: X轴  Y轴  Rpx  color  inset;

默认是外阴影   内阴影：inset 可以设置成内部阴影

例：<div  style="box-shadow:-10px 0px 10px red,   /*左边阴影*/ 
                                                 0px -10px 10px #000,  /*上边阴影*/ 
                                                 10px 0px 10px green,  /*右边阴影*/ 
                                                 0px 10px 10px blue;" /*下边阴影*/ >

       </div>

显示：

 

兼容性：

主流浏览器需要写成-webkit-box-shadow的形式，

Firefox浏览器则需要写成-moz-box-shadow的形式

oprea浏览器  -o-box-shadow   IE>9  -ms-box-shadow