How to make text unselectable in css

Css method to realize that text cannot be selected: You can use the user-select attribute, such as [-webkit-user-select:none;-moz-user-select:none;]. The user-select attribute is used to control the selectability of content.

Attribute introduction:

user-select is a new function in the css3 UI specification, used to control the selectivity of content .

(Learning video recommendation: css video tutorial)

Attribute value:

auto - the default value, the user can select the element The content

none - the user cannot select any content in the element

text - the user can select the text in the element

element - the text is optional, but only Within the bounds of a limited element (only supported by IE and FF)

all - Within the editor, if a double-click/context click occurs on a child element, the highest-level ancestor element of that element will be selected.

-moz-none——Firefox private, the text of elements and sub-elements will not be selectable, except the text in the input input box (under IE browser, it is through the onselectstart="javascript:return false;" event To implement this function)

Code example:

/*设置文字不能被选中     以下为css样式*/
-webkit-user-select:none;
   -moz-user-select:none;
   -ms-user-select:none;
   user-select:none;

Related recommendations:CSS tutorial

The above is the detailed content of How to make text unselectable in css. For more information, please follow other related articles on the PHP Chinese website!