因为css user-select 属性在标准化之前，各浏览器厂商为了抢先实现该功能，分别使用了各自的私有前缀语法。这导致开发者必须为不同内核的浏览器编写对应的样式代码，以确保在所有环境下都能生效。
WebKit内核浏览器需要哪个前缀
WebKit内核的浏览器（如旧版Safari、Chrome和Edge）使用 -webkit- 前缀。这是最早引入该特性的引擎之一，其标准写法为 -webkit-user-select。
body {
-webkit-user-select: none;
}
这段代码会在所有基于WebKit或Blink内核的浏览器中禁止文本选择。由于现代Chrome和Edge也基于Blink（源自WebKit），因此这个前缀依然广泛适用。
Mozilla Firefox需要哪个前缀
Firefox使用的是Gecko内核，它采用了 -moz- 前缀。其对应的属性名为 -moz-user-select。如果不加此前缀，Firefox将无法识别该指令。
body {
-moz-user-select: none;
}
加上这一行后，Firefox用户访问页面时将无法选中页面上的文字。这与WebKit的行为一致，只是语法标识不同。
如何统一处理所有浏览器的兼容性
为了确保代码在所有主流浏览器中都能正常工作，通常的做法是同时声明带前缀的版本和不带前缀的标准版本。标准版本 user-select 目前已被所有现代浏览器支持，但保留前缀可以兼容较旧的浏览器版本。
body {
-webkit-user-select: none; /* Chrome, Safari, Edge */
-moz-user-select: none; /* Firefox */
-ms-user-select: none; /* IE 10+ */
user-select: none; /* Standard syntax */
}
在实际开发中，如果目标环境不包含IE10及以下版本，可以省略 -ms- 前缀。通过这种层层递进的声明方式，可以确保无论用户使用哪种浏览器，都能获得预期的无选择效果。这种多前缀策略是CSS早期发展过程中常见的兼容性解决方案，随着W3C标准的普及，未来这类前缀将逐渐减少。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
