user-select:value; 值: auto——默認值,用戶可以選中元素中的內容 none——用戶不能選擇元素中的任何內容 text——用戶可以選擇元素中的文本 element——文本可選,但僅限元素的邊界內(只有IE和FF支持) all——在編輯器內,如果雙擊/上下文點擊發生在子元素上,改值的最高級祖先元素將被選中。 -moz-none——firefox私有,元素和子元素的文本將不可選,但是,子元素可以通過text重設回可選。
實例——用鼠標拖動或雙擊下面的文字試下:前端觀察是一個純粹的前端技術分享網站,本站的目的是為前端技術人員提供所需的資訊及資源。
目前,只有Gecko和webkit支持該屬性,包括基本上所有版本的Firefox/Chrome/Safari,IE10中也將支持該屬性。當然,各個瀏覽器都必須加上私有前綴。Opera尚不支持。
結語這個屬性,在之前是被用來保護網站的內容,不被用戶復制和轉載,從而保護資訊的版權,但是這樣卻對普通用戶的用戶體驗造成了傷害,而且,并不能真正的保護頁面中的內容,這對前端開發人員來說,很容易搞定的吧? …XD
現在,HTML5蒸蒸日上,很多網站或者web app會使用到Drag and Drop技術,user-select正好在一些情境中可以用到。
當然,技術是為人服務的,怎么用都可以,但是,傷害用戶體驗的產品,最終是得不到用戶的吧。。。
新聞熱點
疑難解答