阴影参数

参数详解
参数 含义 详细说明
inset (可选) 内阴影 默认是外阴影(在盒子外部)。加上 inset 后,阴影会绘制在盒子内部(像凹进去的效果)。
offset-x (必填) 水平偏移 阴影向右(正数)或向左(负数)移动的距离。
例: 5px 表示阴影在右侧; -5px 表示在左侧。
offset-y (必填) 垂直偏移 阴影向下(正数)或向上(负数)移动的距离。
例:5px 表示阴影在下方; -5px表示在上方。
blur-radius (可选) 模糊半径 阴影的模糊程度。
- 0:边缘清晰锐利(模拟边框的关键)。
- 值越大:阴影越模糊,扩散范围越大。
- 不能为负数。
spread-radius (可选) 扩展半径 阴影的整体放大或缩小。
- 正数:阴影向四周扩大(模拟加粗边框的关键)。
- 负数:阴影向中心收缩。
- 默认为 0
color (可选) 颜色 阴影的颜色。可以是十六进制、rgb、rgba 等。
- 如果省略,浏览器通常使用当前文字颜色 (color),但在某些浏览器可能默认为透明或黑色,建议始终明确指定。

阴影示例