CSS 添加阴影（附代码案列讲解）
/* 添加一个简单的阴影效果到div元素 */
div {
box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.5);
}
/* 添加一个内阴影到段落元素 */
p {
box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
}
/* 添加一个模糊效果的阴影，并设置偏移量和扩散范围 */
.blur-shadow {
box-shadow: 0px 0px 20px 10px rgba(0, 0, 0, 0.5);
}
/* 使用多重阴影添加一个有层次感的阴影效果 */
.multiple-shadows {
box-shadow:
0px 0px 5px 0px rgba(0, 0, 0, 0.2),
0px 0px 10px 0px rgba(0, 0, 0, 0.3);
}这段代码展示了如何使用CSS的box-shadow属性来为元素添加阴影。每个例子都简单明了地演示了如何使用这个属性，包括阴影的模糊半径、偏移量、扩散范围、是否内阴影以及是否多重阴影等。
评论已关闭