text-shadow多层叠加须从内到外书写，每层必须完整写出offset-x offset-y blur-radius color四个值；推荐4层冷暖过渡组合，并用rgba调整alpha实现光晕闪烁动画，禁用opacity。
text-shadow 多层叠加的顺序和参数怎么写
必须从内到外写，越靠前的 text-shadow 越贴近文字，越靠后越外扩。每层都得写全四个值：offset-x offset-y blur-radius color，哪怕偏移是 0 0 也不能省略——漏掉会直接导致整条声明失效。
常见错误是把所有层颜色设成一样、模糊半径线性递增（比如 5px, 10px, 15px, 20px），结果光晕发平、没层次。真实霓虹有冷暖过渡和衰减节奏，推荐组合：
-
0 0 5px #fff—— 白色内核，高亮文字轮廓 -
0 0 10px #0af—— 青蓝主色，比纯蓝更通透 -
0 0 25px #f0f—— 品红外晕，制造色温跳跃 -
0 0 45px rgba(255, 0, 222, 0.6)—— 最外层用rgba降透明度，模拟光散射衰减
为什么不能只调 opacity 实现闪烁
直接对元素加 opacity 动画，会让文字本体和所有 text-shadow 一起变淡，效果像灯泡快没电了，失去霓虹特有的“光晕强度变化”感。
真正要动的是光晕的“浓度”，不是文字可见度。所以动画里每一帧都得重写完整的 text-shadow 值，重点改颜色的 alpha 分量：
立即学习“前端免费学习笔记（深入）”；
- 亮态：
0 0 5px rgba(255, 255, 255, 1), 0 0 10px rgba(0, 170, 255, 1), … - 暗态：
0 0 5px rgba(255, 255, 255, 0.4), 0 0 10px rgba(0, 170, 255, 0.3), …
别偷懒写成 opacity: 0.3 → 1，那不是霓虹，是渐隐。
字体、背景和性能怎么配合
细字体 + 大模糊 = 文字“化掉”，必须用粗体（font-weight: 900）或无衬线黑体（如 Arial Black、system-ui）。背景必须深色，#0d0d0d 比纯黑 #000 更稳，避免高光过曝。
性能上，超过 8 层 text-shadow 在低端设备或 Safari ≤15.4 上容易卡顿。建议控制在 4–6 层，外加 will-change: text-shadow 提前提示渲染引擎。如果只是静态效果，去掉动画后可放宽到 8 层；若需动画，优先保节奏，砍掉冗余中间层。
@keyframes 动画节奏怎么避开“呼吸灯陷阱”
匀速 ease-in-out + alternate 是医院监护仪节奏，不是霓虹灯。真实霓虹有老化、电压不稳带来的不规则感。
更接近实际的做法是用 cubic-bezier(.68, -0.55, .27, 1.55) 这类非对称缓动，或者拆成三段关键帧：
-
0%：全亮，text-shadow完整且 alpha 饱满 -
65%：骤暗，外层 alpha 突降到 0.2，内层保留 0.6 -
100%：回亮，但不完全复原，留一点余光（比如内层 alpha=0.9）
动画时长落在 1.4s～2.2s 区间最自然。太短像抽搐，太长像待机。
