关于阴影生成器
CSS阴影生成器可视化生成box-shadow和text-shadow代码,支持多层阴影/模糊半径/扩展/颜色调整。实时预览,一键生成阴影CSS。
使用方法
- 选择阴影类型(盒阴影/文字阴影)
- 调整偏移/模糊/扩展/颜色
- 可添加多层阴影
- 复制生成的CSS代码
常见问题
- box-shadow的4个值分别是什么?
- 依次是:X偏移(水平) Y偏移(垂直) 模糊半径 扩展半径。例如'2px 2px 5px 0px rgba(0,0,0,0.3)'是右下方带模糊的阴影。
- 内阴影怎么做?
- 在box-shadow值前加inset关键字。如'inset 0 0 10px rgba(0,0,0,0.5)'创建内凹效果,常用于输入框聚焦状态。
- 多层阴影有什么用?
- 叠加多层阴影创建更真实的深度感。例如近处深色小阴影+远处浅色大阴影模拟材质设计(Material Design)的层级效果。