Style userSelect Property
Example
Prevent text selection of a <div> element:
document.getElementById("myDiv").style.userSelect = "none";Try it Yourself »
More "Try it Yourself" examples below.
Description
The userSelect property sets or returns whether the text of an element can be selected or not.
If you double-click on some text, it will be selected/highlighted. This property can be used to prevent this.
Browser Support
The numbers in the table specify the first browser version that fully supports the property.
Numbers followed by ms or Webkit specify the first version that worked with a prefix.
| Property | |||||
|---|---|---|---|---|---|
| userSelect | 54.0 | 79.0 10.0 ms |
69.0 | 3.1 Webkit | 41.0 |
Syntax
Return the userSelect property:
object.style.userSelect
Set the userSelect property:
object.style.userSelect = "auto|none|text|all"
Property Values
| Parameter | Description |
|---|---|
| auto | Default. Text can be selected according to the browser's default settings |
| none | Prevent text selection |
| text | The text can be selected by the user |
| all | Text selection is made with one click instead of a double-click |
Technical Details
| Default Value: | auto |
|---|---|
| Return Value: | A String, representing whether the text of an element can be selected |
| CSS Version | CSS3 |
More Examples
Example
Get the value of the "user-select" property of an element:
document.getElementById("demo").style.userSelect;Try it Yourself »
Related Pages
CSS reference: user-select property
