您现在的位置是：首页>读书 > 正文
css多重阴影
2026-11-13【读书】
简介CSS多重阴影是通过`box-shadow`属性为元素添加多个阴影效果的技术。它能增强视觉层次感，常用于按钮、卡片等设计中。 属性 说明 `bo...
CSS多重阴影是通过`box-shadow`属性为元素添加多个阴影效果的技术。它能增强视觉层次感，常用于按钮、卡片等设计中。
| 属性 | 说明 |
| `box-shadow` | 设置元素的阴影，支持多个阴影值，用逗号分隔 |
| `inset` | 阴影在元素内部显示 |
| `color` | 阴影颜色，默认为黑色 |
| `offset-x` | 水平偏移量，正数向右，负数向左 |
| `offset-y` | 垂直偏移量，正数向下，负数向上 |
| `blur-radius` | 阴影模糊程度，数值越大越模糊 |
| `spread-radius` | 阴影扩展大小 |
使用示例：
`box-shadow: 0 2px 4px 000, inset 0 0 5px fff;`
多重阴影可提升设计细节，但需注意性能与兼容性。合理使用能让页面更具立体感和专业感。
