::selection不能禁止选中文本，它仅控制已选中文本的样式；user-select: none才控制可选性，且需写全前缀、避免被覆盖或contenteditable干扰，移动端还需配合-webkit-touch-callout等属性。
::selection 不能禁止用户选中文本——它只负责已选中文本的样式渲染，和“能不能选”完全无关。
为什么::selection加user-select: none无效？
很多人在::selection里写user-select: none，这行声明会被浏览器直接忽略。因为::selection是伪元素，不支持user-select属性，也不参与 DOM 选择逻辑。它只响应“已经被选中”的状态，不是开关。
user-select: none为什么写了还生效不了？
常见失效原因有四个：
- 没写全前缀：
-webkit-user-select: none（iOS/Safari 必须）、-moz-user-select: none（旧 Firefox）、-ms-user-select: none（旧 Edge），最后才是user-select: none；顺序错了或漏了某条，旧版 Safari 就会照常允许选中 - 目标元素是
<input>、<textarea></textarea>或带contenteditable="true"的元素——这些浏览器强制启用选中，user-select被无视 - 子元素显式设了
user-select: text（比如第三方组件内部写的），覆盖了父级的none - 样式被更高优先级规则覆盖，用开发者工具看「Computed」面板里最终值是不是
none
移动端长按选中怎么真正禁掉？
仅靠user-select: none不够。iOS 长按时仍可能弹出「复制/搜索」气泡菜单，Android WebView 可能保留光标点。必须组合使用：
-
-webkit-user-select: none（禁高亮+光标） -
-webkit-touch-callout: none（关 iOS 气泡菜单） - 对表单控件要单独重置：
input, textarea, [contenteditable] { user-select: text; }，否则输入框变不可聚焦
注意：pointer-events: none不能替代user-select，它只阻止点击，不影响文本选择行为。
想只让某段文字可选，该怎么配？
没有“局部启用”的捷径，得先全局禁用再逐个放开：
- 在
body或根容器上设四套user-select: none - 给需要可选的区域（比如代码块）加类：
.code-block { user-select: text; } - 避免用
user-select: all——它在部分 Android WebView 下表现异常，拖选时跳选或失焦 - Shadow DOM 内部需单独声明，外部样式不会穿透
真正容易被忽略的是：禁用选中后，::selection样式本身也失去意义；而如果你只改了::selection背景色却没关user-select，用户照样能复制——这根本不是防复制的方案。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
