CSS user-select 属性用于控制用户是否可以选中文本内容。它主要用于禁止或允许用户通过鼠标或键盘选择页面上的文本。该属性在提升用户体验、防止内容被复制或增强界面交互时非常有用。作用说明：禁止文本选择 设置 user-select: none; 可以阻止用户选择页面中的任何文本，常用于防止用户复制文字或防止误操作。允许文本选择 默认情况下，user-select 的值是 auto，即允许

CSS 的 `user-select` 属性是控制网页文本可选性的关键工具，既能通过 `none` 值有效防止用户误选、复制敏感内容或干扰交互（如按钮标签、图标文字），也能借助 `text`、`all`、`contain` 等值实现精细化选择体验；尽管现代浏览器普遍支持无前缀写法，但为兼容旧版 Chrome、Firefox 和 IE/Edge，仍需添加 `-webkit-`、`-moz-`、`-ms-` 等前缀；需特别注意：它仅作用于视觉层选择行为，无法真正阻止复制（Ctrl+C 在部分浏览器仍有效）、截图或开发者工具提取，因此适用于提升体验与防误操作，而非安全级内容保护——真正敏感信息必须依赖服务端水印、动态渲染或权限管控。

user-select 属性控制文本是否可被用户选中

它直接决定鼠标拖拽时能否高亮、复制页面中的文字内容。默认值是 text（可选），但设为 none 后，哪怕用鼠标左键拖动也不会出现蓝色选区，copy 则只允许复制（不显示选区但 Ctrl+C 仍生效）。

常见取值及实际行为差异

不同浏览器对部分值支持程度不一，生产环境建议优先用兼容性好的几个：

• auto：由浏览器决定（通常等同于 text）
• text：正常可选、可复制
• none：完全不可选，也阻止右键菜单里的“复制”项（但键盘 Ctrl+C 在某些浏览器下仍可能生效）
• all：单击即全选该元素内所有文本（适合短标签如 ）
• contain：仅在该元素内部触发选择（子元素不会“逃逸”到父级选区），但目前仅 Firefox 原生支持

必须加浏览器前缀才能生效的场景

div.no-select {
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
}