::selection不能禁止复制，仅控制已选中文本样式；真正禁用需用user-select: none，而::selection可配合将其高亮“视觉抹除”以弱化反馈。
直接用 ::selection 无法“限制复制”，它只控制视觉高亮样式；真正阻止复制得靠 user-select: none，而 ::selection 的作用只是让高亮看起来不突兀甚至“藏起来”。
为什么 ::selection 不能禁止复制
::selection 是纯样式层伪元素，浏览器在用户选中时才渲染它——选中行为本身由 user-select 控制。如果没被允许选中，::selection 根本不会触发。所以：
- 想禁复制 → 必须设
user-select: none在目标元素或其祖先上 - 想弱化高亮视觉（比如防截图、降低干扰）→ 才轮到
::selection出场 - 两者常配合：先禁选中，再用
::selection拦住那些仍能闪出高亮的边缘情况（如 Safari 长按拖动瞬间）
::selection 怎么“藏”掉高亮效果
关键不是让它变透明，而是用和背景一致的色值“视觉抹除”。但注意：background-color: transparent 会退回到系统默认蓝，必须写实色：
- 对浅色容器：用
background-color: #fff+color: inherit（但注意inherit无效，得写死，比如color: #333） - 对深色容器：用
background-color: #1e1e1e+color: #ddd - 移动端尤其 iOS Safari，
text-shadow基本不可靠，只依赖background-color和color
示例（让敏感段落高亮“消失”）：
立即学习“前端免费学习笔记（深入）”；
.sensitive {
user-select: none;
}
.sensitive::selection {
background-color: #f8f8f8;
color: #333;
}
::-webkit-selection { background-color: #f8f8f8; color: #333; }
::selection { background-color: #f8f8f8; color: #333; }
常见失效原因：user-select 和 ::selection 的冲突链
哪怕写了 ::selection，只要下面任一条件成立，它就完全不生效：
- 父级元素（比如
.card或article）设置了user-select: none→ 子元素连选中动作都触发不了 - 目标文本实际在
span或em里，但你只写了.sensitive::selection→::selection不继承，必须写成.sensitive span::selection - CSS 被框架重置（如 Ant Design），全局
::selection被设为background-color: transparent→ 得用更高权重覆盖，比如body .sensitive::selection - 规则写在
@media内部或 CSS-in-JS 局部作用域里 →::selection必须是顶层声明，否则 Safari 直接跳过
暗色模式与移动端的硬限制
固定色值在暗色模式下极易翻车：文字变白+白底 = 看不见。但 ::selection 不支持 prefers-color-scheme 媒体查询嵌套（规则会被忽略）。可行方案只有：
- 用 JS 检测
matchMedia('(prefers-color-scheme: dark)')，动态插入<style>标签覆盖::selection - 放弃适配，统一用中性灰阶（如
#e0e0e0/#444），牺牲一点对比度换稳定性 - 接受现实：iOS Safari 长按呼出菜单时，
::selection样式根本不会应用——这是系统级限制，CSS 和 JS 都绕不过
最易被忽略的一点：你写的 ::selection 规则，可能正被某个第三方 UI 库悄悄重置，且没有报错提示。遇到“明明写了却无效”，第一反应不该是调语法，而是查 computed styles 里最终生效的是哪条规则。
