CSS3-盒子阴影

最新推荐文章于 2022-01-20 14:58:04 发布

蓬莱老仙

最新推荐文章于 2022-01-20 14:58:04 发布

阅读量233

点赞数

分类专栏： CSS3

本文链接：https://blog.csdn.net/weixin_44486539/article/details/102065206

版权

本文介绍了CSS3中用于创建盒子阴影的样式属性`box-shadow`，详细解析了其语法和各个属性值的含义，包括水平阴影、垂直阴影、模糊半径、扩展半径以及颜色。还给出了设置内阴影和添加多个阴影的示例，帮助理解如何在元素上应用丰富多样的阴影效果。

摘要由CSDN通过智能技术生成

CSS3 新增了 box-shadow 样式属性用来给元素设置一个或多个下拉阴影的框；该属性可以设置多个属性值

语法：

box-shadow: h-shadow v-shadow blur spread color inset;

属性值说明：

属性值	说明
h-shadow	必需的值，用于设置水平阴影的位置，可以为负值（阴影方向原来方向相反）
v-shadow	必需的值，用于设置垂直阴影的位置，可以为负值
blur	用于设置元素阴影的模糊距离
spread	用于设置阴影的大小，为正值时元素四周都会增加阴影
color	设置阴影的颜色
inset	将阴影设置为内阴影（默认为外阴影）

示例：<

关注

专栏目录