The user-select property
The user-select property controls
the selection behavior of a text and
other elements on a page.
Syntax
cssselector {
user-select: none | contain | all | auto | text;
}
Values
| Value | Description |
|---|---|
none |
Text is not selected. |
contain |
A selection started inside an element will not extend beyond that element. |
all |
If a double click occurs on a nested element, all contents of the parent with that property value will be selected. |
auto |
The calculated value is automatically determined
as follows: for
after
and
before
pseudo-elements the value is none, for
an edited element the value is contain
if the element's parent has the all or none
value - the element itself will have the same,
otherwise the value will be text.
|
text |
The user can select text in an element. |
Default value: text.
Comment
Some values may not work in all browsers.
Example . The none value
The following text cannot be selected:
html<div id="elem">
Lorem ipsum dolor sit amet.
</div>css#elem {
user-select: none;
}
Результат:
See also
-
the
selectionpseudo-element
that controls styles of a selected text -
the
pointer-eventsproperty
that removes a response to the mouse