text-shadow 在 ::selection 中完全无效，仅 color 和 background-color 可用；高对比选中需靠强反差色组合，避免纯黑/白背景，小字号时提高 background-color 透明度。
text-shadow 本身不能实现文本选择高对比度效果
直接用 text-shadow 改变选中文本的样式是无效的——浏览器对选中状态（::selection）的 CSS 支持非常有限，text-shadow 在绝大多数浏览器中被忽略。你写的 text-shadow: 0 0 2px white; 放在 ::selection 里，Chrome、Firefox、Safari 都不渲染它。
::selection 中哪些 CSS 属性真正可用
能生效的只有极少数属性，且各浏览器支持不一致：
-
color：始终可用，控制选中文本颜色 -
background-color：始终可用，控制选中背景色（推荐用rgba()保透明） -
text-shadow：❌ 全平台禁用（包括 Chrome 125+、Firefox 126、Safari 17.5） -
font-weight/font-size/letter-spacing：❌ 不支持 -
border/outline：❌ 无效
所以“用 text-shadow 做高对比选中效果”这个思路从底层就被堵死了。
真正可行的高对比文本选择方案
绕过限制，靠组合策略提升可读性：
立即学习“前端免费学习笔记（深入）”；
- 用强反差
background-color+ 互补color，例如深色背景上：::selection { background: #007acc; color: white; } - 避免纯黑/纯白背景，改用带灰阶的色值（如
#0066aa而非#000000），减少视觉刺感 - 对小字号文本（≤14px），把
background-color的 alpha 值调高到0.9以上，防止文字被“吃掉”边缘 - 如果编辑器内容可控制 DOM，可在 JS 中监听
selectionchange，临时包裹选区节点并加 class，手动应用text-shadow到该 wrapper —— 但这属于模拟，不是原生选中效果
为什么有人误以为 text-shadow 在 ::selection 里有效
常见混淆点：
- 把编辑器 UI 层（如 CodeMirror 的
.cm-selectionBackground）当成原生::selection，其实那是自定义渲染 - 在非标准环境（如 Electron 封装的编辑器）里启用了私有 CSS 扩展，不可移植
- 看到伪元素（如
::before）里加了text-shadow并误认为是选中态——实际是静态装饰
真正在 HTML 编辑器里做高对比选中，得接受浏览器的规则边界：能调的只有 color 和 background-color，其余全是幻觉。强行塞 text-shadow 不仅没用，还会让调试更费时间。
