Свойство user-select
Описание
Управляет поведением выделения текста и других элементов на странице, в частности, позволяет запретить выделение текста. Обычно применяется для интерактивных элементов, на которые можно щёлкать, например, вкладки, и для которых выделение текста нежелательно.
Internet Explorer и Edge поддерживают свойство -ms-user-select.
Chrome до версии 54, Opera до версии 41, Safari и Android поддерживают свойство -webkit-user-select.
Firefox поддерживает свойство -moz-user-select.
Значение contain поддерживается только в IE.
Синтаксис
user-select: auto | none | text | all | contain;Подробности
| Значение | Описание |
| auto | Для редактируемых элементов значение принимается contain. Если у родителя значение user-select установлено как all, то для элемента оно тоже будет all. Если у родителя значение user-select установлено как none, то для элемента оно тоже будет none. Во всех остальных случаях принимается значение text. |
| none | Пользователю запрещено выделять элемент. |
| text | Пользователь может выделить текст в элементе. |
| all | Позволяет выделить текст внутри элемента, включая дочерние элементы. |
| contain | Позволяет выделять текст, но только внутри границ элемента. |
Пример
<!DOCTYPE html>
<html lang='ru'>
<head>
<meta charset='UTF-8'>
<meta name='viewport' content='width=device-width, initial-scale=1.0'>
<title>Document</title>
</head>
<body>
<style>
.non {
user-select: none;
}
.enable {
user-select: all;
}
</style>
<p class='non'>Этот текст нельзя выделить</p>
<p><input type='text' value='Этот текст можно выделить' /></p>
<p class='enable'>Слова в этом тексте не выделяются по отдельности.</p>
</body>
</html>Читайте также
Свойство animation
Используется для создания анимации.
Сокращенная запись для свойств animation-name, animation-duration, animation-timing-function, animation-delay, ...
Селекторы атрибутов со значениями
Устанавливает стиль для элемента в том случае, если задано определённое значение специфичного атрибута....
Селекторы атрибутов со значениями в неопределенном месте
Возможны варианты, когда стиль следует применить к тегу с определённым атрибутом, когда частью его значения является некоторый текст. При этом точно н...
Свойство overflow-x
Управляет отображением содержания блочного элемента по горизонтали, если контент целиком не помещается и выходит за область справа или слева от блока....