userselect的详细用法

前言

做网页的时候，有些文字我们需要能被选中，有些我们不要能被选中，那么这就需要用到一个 css 属性了，那就是 user-select

使用方法

user-select: none|auto|text|contain|all;
 
/*firefox 浏览器 */
-moz-user-select: none|text|all;
 
/*safari、chrome 浏览器 */
-webkit-user-select: none|text|all; /*Safari 中不支持该属性值，只能使用 none 或者 text，或者是在 html 的标签属性中使用 */
 
/*ie 浏览器 */
-ms-user-select: none|text|element;
 
属性值：none :  元素和子元素的文本将无法被选中
text :  文本可以被选中
auto :  文本将根据浏览器的默认属性进行选择
all  :  当所有内容作为一个整体时可以被选择。如果双击或者在上下文上点击子元素，那么被选择的部分将是以该子元素向上回溯的最高祖先元素
contain、element :  可以选择文本，但选择范围受元素边界的约束，也就是选择的文本将包含在该元素的范围内。只支持 Internet Explorer
 
注意：浏览器实现之间的区别之一是继承。在 Firefox 中，-moz-user-select 不是由绝对定位的元素继承的，但在 Safari 和 Chrome 中，-webkit-user-select 却是由绝对定位的元素继承而来的。