css 底部阴影

作者：思念的回忆发布日期:2025-07-29 浏览:38

/* 示例代码：为元素添加底部阴影效果 */

.box {
  /* 定义一个盒子 */
  width: 200px;
  height: 100px;
  background-color: #f0f0f0;
  /* 添加底部阴影 */
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
}

/* 解释说明：
- `box-shadow` 属性用于为元素添加阴影效果。
- `0` 表示水平偏移量，值为 0 意味着阴影不会在水平方向上偏移。
- `4px` 表示垂直偏移量，正值表示阴影在元素下方。
- `6px` 表示模糊半径，值越大阴影越模糊。
- `rgba(0, 0, 0, 0.1)` 表示阴影的颜色和透明度，这里使用了黑色并设置了 10% 的透明度。
*/

上一篇：css 颜色代码

下一篇：float在css中的用法