編碼的世界 / 優質文選 / 生涯

[CSS]設置不可選中


2022年5月20日
-   

/* Chrome all / Safari all /opera15+*/
-webkit-user-select: none;
/* Firefox all */
-moz-user-select: none;
/* IE 10+ */
-ms-user-select: none;
/* 通用 */
user-select: none;

auto——默認值,用戶可以選中元素中的內容 text——用戶可以選擇元素中的文本 element——文本可選,但僅限元素的邊界內(只有IE和FF支持) all——在編輯器內,如果雙擊或上下文點擊發生在子元素上,該值的最高級祖先元素將被選中。
IE6-9不支持該屬性,但支持使用標簽屬性 onselectstart=”return false;” 來達到 user-select:none 的效果;Safari和Chrome也支持該標簽屬性; 直到Opera12.5仍然不支持該屬性,但和IE6-9一樣,也支持使用私有的標簽屬性 unselectable=”on” 來達到 user-select:none 的效果;unselectable 的另一個值是 off; 除Chrome和Safari外,在其它瀏覽器中,如果將文本設置為 -ms-user-select:none;,則用戶將無法在該文本塊中開始選擇文本。不過,如果用戶在頁面的其他區域開始選擇文本,則用戶仍然可以繼續選擇將文本設置為 -ms-user-select:none; 的區域文本;
參考: http://www.css88.com/book/css/properties/user-interface/user-select.htm

熱門文章