单层text-shadow描边不均匀是因为它仅覆盖右下角，缺上、下、左及三处对角共七边，无法形成封闭路径；必须用8层±1px偏移、blur-radius全为0的阴影才能完整围合文字。
直接用 text-shadow 模拟描边最可靠，但必须写满 8 层、blur-radius 全为 0、偏移严格 ±1px 或 ±2px，否则边缘发虚、漏底、错位。
为什么单层 text-shadow: 1px 1px 0 #000 描边不均匀？
它只在右下角打一个“补丁”，文字左上、顶部、左侧全无覆盖，实际是缺三边的残缺描边。视觉上像被削掉一块，尤其在小字号或 Retina 屏下更明显。
- 描边本质是封闭路径：必须覆盖上、下、左、右 + 左上、右上、左下、右下共 8 个方向
- 少于 8 层 → 角落露白底，文字边缘出现“缺口”
- 哪怕只漏
-1px -1px 0 #000（左上），左上角就会透出背景色
text-shadow 描边参数怎么配才不糊？
模糊半径（blur-radius）只要大于 0，阴影就发散，描边变毛边、颜色混叠。这不是渲染 bug，是设计使然——text-shadow 是投影，不是描边。
- 所有层的
blur-radius必须显式写成0，不能省略（省略 = 浏览器默认 0，但部分旧版 Safari 会误判） - 偏移量统一用
px单位，避免rem在缩放时错位 - 推荐起步值：
-1px -1px 0 #000, 0 -1px 0 #000, 1px -1px 0 #000, -1px 0 0 #000, 1px 0 0 #000, -1px 1px 0 #000, 0 1px 0 #000, 1px 1px 0 #000 - 描边加粗？把所有
1px换成2px，但需同步扩大偏移组合（如加入-2px -2px等）
Safari 和 iOS 上 color: transparent 描边为啥失效？
iOS 15–16 的 Safari 曾丢弃超过 4 层的 text-shadow，尤其当 color 设为 transparent 时，部分阴影直接不渲染——文字变空，只剩背景。
- 真机必测：iOS Safari 下优先用
color: #000+ 单色描边（如#fff），兼容性翻倍 - 避免用 CSS 自定义属性传
text-shadow值，Safari 16.4 前对--shadow的解析不稳定 - 若坚持多色描边，降级 fallback 写死一层单色描边：
text-shadow: 0 0 0 #000;保底
比 text-shadow 更准的描边方案有哪些？
-webkit-text-stroke 看似简单，但它不支持多色、Firefox 完全不认；SVG <text stroke></text> 精确但破坏语义、字体继承断裂、响应式排版要重算 stroke-width。
- 纯单色 + Chrome/Edge 主力场景 → 直接用
-webkit-text-stroke: 2px #333;，简洁高效 - 需要渐变描边或设计强控 → 改用 SVG，但得接受
font-family、font-size需手动同步 - 动画描边粗细？
text-shadow层叠数固定，无法用transition平滑变化，只能 JS 动态拼字符串
描边不是“加个影子”那么简单——它是像素级围合，差 1px 偏移、漏 1 层阴影、多 0.1px 模糊，都会在高分屏或深色背景下立刻暴露。别信“差不多”，检查每一层 offset 和 blur。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
