box-shadow 属性可以向框添加一个或多个阴影。
语法:
CSS中使用
box-shadow: h-shadow v-shadow blur spread color inset;
JS中使用:
object.style.boxShadow="10px 10px 5px #888888"
h-shadow:水平阴影的位置。允许负值。
v-shadow:垂直阴影的位置。允许负值。
blur:模糊阴影的距离。
spread:阴影的尺寸。
color:阴影的颜色。
inset:将外部阴影 (outset) 改为内部阴影。
例如:
box-shadow:10px 10px black /**/ box-shadow:50px 50px black box-shadow:50px 50px 5px black box-shadow:50px 50px 10px black box-shadow:50px 50px 20px black box-shadow:50px 50px 50px black box-shadow:50px 50px 50px 5px black box-shadow:50px 50px 50px 10px black box-shadow:50px 50px 50px 20px black box-shadow:50px 50px 50px 20px red box-shadow:50px 50px 50px 20px blue box-shadow:50px 50px 50px 20px pink box-shadow:40px 40px 50px 20px pink box-shadow:20px 20px 50px 20px pink box-shadow:10px 10px 50px 20px pink inset box-shadow:10px 10px 30px 20px pink inset box-shadow:10px 10px 5px 20px pink inset box-shadow:10px 10px 5px 10px pink inset box-shadow:10px 10px 5px 5px pink inset
div#MyDIV { background-color:yellow; width:200px; height:100px; box-shadow:/*阴影代码*/ }