text-shadow四向平移不是描边，因其仅单向偏移导致三面缺失；真正围住文字需用4个0模糊度的整数像素对角偏移：-1px -1px、1px -1px、-1px 1px、1px 1px，且文字色设为transparent。
text-shadow四向平移为什么不是描边？
写text-shadow: 1px 1px 0 #000只会让文字右下角多出一块黑影，看起来像错位投影，不是描边。描边必须把文字“围起来”，单方向偏移永远只补一角，漏掉左上、左下、右上三面，视觉上就是残缺的。
四向平移怎么写才真正围住文字？
小字号（14–20px）用这4个方向刚好够用，每个阴影的blur-radius必须是0，偏移量必须是整数像素：
text-shadow: -1px -1px 0 #000,
1px -1px 0 #000,
-1px 1px 0 #000,
1px 1px 0 #000;
- 四个偏移组合覆盖了左上、右上、左下、右下四个对角，形成闭合包围
- 不能省略任意一个，少一个就会在对应角落露白底
- 颜色统一用实色（如
#000），避免透明色导致边缘透出背景 - 如果文字本身有
color: black，且背景是浅色，描边可能被盖住——建议主文字色设为transparent，纯靠阴影显形
四向描边在哪些场景会失效？
四向方案只适合几何轮廓简单的文字，遇到字母o、e、S或中文“口”“田”这类封闭结构时，对角偏移会在曲线/横竖交接处留缝隙，肉眼可见断点。
- 中大字号（≥24px）或需要饱满描边时，必须补上正交方向：加
0 -1px 0 #000、0 1px 0 #000、-1px 0 0 #000、1px 0 0 #000，凑成8向 - Retina屏上
1px偏移可能渲染为物理0.5px，描边变淡甚至消失；此时别直接改成2px，而是用@media (-webkit-min-device-pixel-ratio: 2)单独给0.5px偏移 - Firefox、Safari、Chrome、Edge 全线支持这种写法，但 Safari iOS 15–16 曾有丢弃第5层以上阴影的bug，真机测试不可跳过
和-webkit-text-stroke混用会怎样？
绝对不要同时写-webkit-text-stroke和text-shadow。WebKit内核下两者叠加会导致描边过重、边缘发糊，而且-webkit-text-stroke在Firefox里完全不生效，等于白写。
- 如果用了
-webkit-text-stroke: 2px #333，必须配color: transparent，否则文字本体色会盖住描边 -
-webkit-text-stroke描边位置固定居中，无法控制是“外描边”还是“内描边”，而text-shadow虽是模拟，但通过调整偏移方向能逼近外描边效果 - 真正跨浏览器稳定的方案只有一个：纯
text-shadow，8向+blur-radius: 0+color: transparent
blur-radius必须显式写成0——漏掉这个0，或者写成0.1px，边缘立刻发虚，看着像描边，其实是投影模糊。前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
