文字阴影颜色由text-shadow第四个参数设置，格式为“水平偏移 垂直偏移 模糊半径 颜色”，支持十六进制、rgb、rgba、hsl及关键字；多层阴影用逗号分隔，从左到右层叠。
文字阴影颜色通过 text-shadow 属性的第三个参数（可选）直接设置，格式为：水平偏移 水平偏移 阴影模糊半径 颜色。颜色可以是十六进制、rgb、rgba、hsl 或颜色关键字。
基础语法与颜色写法
text-shadow 的完整语法是：
text-shadow:
-
前两个值（如
2px 2px）表示阴影相对于文字的横向和纵向偏移，必填 -
第三个值（如
4px）控制阴影模糊程度，可省略（默认为 0） -
第四个值就是颜色，必须显式写出；若省略，浏览器会使用文字当前的
color值
常用颜色写法示例
以下写法均合法，可按需选用：
-
text-shadow: 1px 1px 2px #333;—— 十六进制 -
text-shadow: 1px 1px 2px rgb(51, 51, 51);—— RGB -
text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.5);—— 半透明黑色（推荐用于柔和效果） -
text-shadow: 1px 1px 2px hsl(0, 0%, 20%);—— HSL -
text-shadow: 1px 1px 2px darkgray;—— 颜色关键字
多层阴影与颜色叠加
用逗号分隔多个阴影，每层可独立设颜色：
-
text-shadow: 1px 1px 0 #ff6b6b, 2px 2px 0 #4ecdc4;—— 双色硬边阴影 -
text-shadow: 0 0 8px rgba(255, 215, 0, 0.7), 0 0 16px rgba(255, 140, 0, 0.4);—— 金色发光效果
注意：层叠顺序从左到右，先写的在下层，后写的在上层。
立即学习“前端免费学习笔记（深入）”；
避免常见错误
- 漏写颜色值，又没设置
color—— 阴影可能不可见或继承父级颜色，建议显式声明 - 模糊半径为 0 时仍加空格（如
1px 1px 0 red）—— 正确；但写成1px 1px red会被解析为1px 1px 0 red，虽可行但不清晰，建议补全 - 在深色背景上用纯黑阴影（
#000）—— 对比弱，可改用更暗或带透明度的色值提升辨识度
