它的值包括 6 个参数：阴影类型，X轴位移，Y轴位移，阴影大小，阴影扩展和阴影颜色。此 6 个参数可以有选择地省略。
浏览器兼容性
Webkit支持：-webkit-box-shadow
Mozilla支持：-moz-box-shadow
IE9支持：box-shadow
IE8及以前：不支持
实用实例
简单效果:
img{
height:300px
-moz-box-shadow:5px 5px
-webkit-box-shadow:5px 5px
box-shadow:5px 5px
}
虚阴影效果:
img{
height:300px
-moz-box-shadow:2px 2px 10px #06c
-webkit-box-shadow:2px 2px 10px #06c
box-shadow:2px 2px 10px #06c
}
渐变阴影效果:
img{
height:300px
-moz-box-shadow:0 0 10px #06c
-webkit-box-shadow:0 0 10px #06c
box-shadow:0 0 10px #06c
}
带光晕效果
img{
height:300px
-moz-box-shadow:0 0 10px 10px #06c
-webkit-box-shadow:0 0 10px 10px #06c
box-shadow:0 0 10px 10px #06c
}
内阴影效果
img{
height:300px
-moz-box-shadow:inset 5px 5px 10px #06c
-webkit-box-shadow: inset 5px 5px 10px #06c
box-shadow: inset 5px 5px 10px #06c
}
彩色阴影
img{
height:300px
-moz-box-shadow:0 0 10px red,
2px 2px 10px 10px yellow,
4px 4px 12px 12px green
-webkit-box-shadow:0 0 10px red,
2px 2px 10px 10px yellow,
4px 4px 12px 12px green
box-shadow:0 0 10px red,
2px 2px 10px 10px yellow,
4px 4px 12px 12px green
}
1、首先新建一个html文件，命名为test.html，使用div标签创建一个模块，用于测试。如下图所示。
2、在test.html文件内，给div添加一个class属性，属性值设置为myway。
3、然后在css标签内，通过class设置div的样式，定义它的宽度为200px，高度为200px，背景颜色为黑色。
4、接着在css标签内，再使用box-shadow属性设置div的阴影效果，其中，左边阴影为绿色，顶部阴影为蓝色，底部阴影为红色，右边阴影为黄色。
5、最后在浏览器打开test.html文件，查看实现的效果，如下图所示就完成了。
