最常见原因是 Safari 兼容性不足和父元素 user-select: none 干扰；需同时声明 ::-webkit-selection 和 ::selection，且确保文本可被选中。
为什么 ::selection 样式不生效
最常见原因是浏览器兼容性或选择器优先级不足。Chrome/Edge 119+、Firefox 120+ 支持标准语法，但 Safari 仍要求带前缀 ::-webkit-selection；另外，::selection 只能设置有限的属性（color、background-color、text-shadow、cursor），其他如 font-weight 或 border 会被忽略。
::selection 必须搭配 ::-webkit-selection 才能全平台生效
Safari 和旧版 Chrome 仅识别 WebKit 前缀版本，且两者需**同时声明**——不能只写一个。现代浏览器会忽略带前缀的规则，但 Safari 完全不认无前缀版本。
正确写法：
::-webkit-selection {
color: #fff;
background-color: #007acc;
}
::selection {
color: #fff;
background-color: #007acc;
}
- 顺序无关紧要，但建议先写
::-webkit-selection再写标准版 - 两组规则的样式必须完全一致，否则 Safari 和 Chrome 表现不统一
- 不要用
!important——它在::selection中多数浏览器不支持
父元素设置了 user-select: none 会导致 ::selection 失效
如果文本容器或其任意祖先有 user-select: none（比如按钮、禁用区域），用户根本无法选中文本，自然不会触发 ::selection 样式。
