css3 user-select 禁止使用者選擇

測試同學經常提的bug就是說怎麼我長按頁面上某些文字或者圖檔，就出現系統的一些黑色彈框，找到我說怎麼會這樣呢，體驗不太好。我就很無語地說，那是浏覽器的特性，允許使用者去選擇某些文字或圖檔，可進行下一步的操作……

當然是可以通過如下方式禁用：

body {
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
  -ms-user-select: none;
}
           

下面解釋一下各個浏覽器核心的屬性的屬性值介紹：

none ：禁止使用者選中
text：對使用者的選擇沒有限制
all：目标元素将整體被選中，也就是說不能隻選中一部分，浏覽器會自動選中整個元素裡的内容。

user-select: none|auto|text|contain|all;
//火狐浏覽器
-moz-user-select: none|text|all;
//谷歌浏覽器
-webkit-user-select: none|text|all
//IE
-ms-user-select: none|text|all|element；