定义和用法

box-shadow 属性向框添加一个或多个阴影。

提示:请使用 border-image-* 属性来构造漂亮的可伸缩按钮!

默认值: none
继承性: no
版本: CSS3
JavaScript 语法: object.style.boxShadow="10px 10px 5px #888888"
语法
box-shadow: h-shadow v-shadow blur spread color inset;
注释:box-shadow 向框添加一个或多个阴影。该属性是由逗号分隔的阴影列表,每个阴影由 2-4 个长度值、可选的颜色值以及可选的 inset
关键词来规定。省略长度的值是 0。

值描述测试
h-shadow必需。水平阴影的位置。允许负值。测试
<http://www.w3school.com.cn/tiy/c.asp?f=css_box-shadow>
v-shadow必需。垂直阴影的位置。允许负值。测试
<http://www.w3school.com.cn/tiy/c.asp?f=css_box-shadow>
blur可选。模糊距离。测试 <http://www.w3school.com.cn/tiy/c.asp?f=css_box-shadow&p=3>
spread可选。阴影的尺寸。测试 <http://www.w3school.com.cn/tiy/c.asp?f=css_box-shadow&p=7>
color可选。阴影的颜色。请参阅 CSS 颜色值。测试
<http://www.w3school.com.cn/tiy/c.asp?f=css_box-shadow&p=10>
inset可选。将外部阴影 (outset) 改为内部阴影。测试
<http://www.w3school.com.cn/tiy/c.asp?f=css_box-shadow&p=15>
亲自试一试 - 实例
扔到桌子上面的图片 <http://www.w3school.com.cn/tiy/t.asp?f=css3_image_gallery>
本例演示如何创建“宝丽来”图片,并旋转图片
实例地址:http://www.w3school.com.cn/tiy/t.asp?f=css3_image_gallery








友情链接
ioDraw流程图
API参考文档
OK工具箱
云服务器优惠
阿里云优惠券
腾讯云优惠券
华为云优惠券
站点信息
问题反馈
邮箱:ixiaoyang8@qq.com
QQ群:637538335
关注微信