Wartość auto jest domyślną wartością właściwości user-select.
Domyślnie treść elementu HTML może zostać zaznaczona oraz skopiowana przez użytkownika w taki sam sposób jak treść elementu rodzica.
Przykład
user-select:auto;
treść tego elementu "span" może zostać zaznaczona oraz skopiowana przez użytkownika w taki sam sposób jak treść elementu "div"
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>Darmowy Kurs CSS</title>
<style>
html {
font-size:16px;
font-family:Helvetica, sans-serif;
}
div {
padding:1em;
font-size:1.3em;
background-color:#CBFFFF;
}
</style>
</head>
<body>
<div>
<span>treść tego elementu "span" może zostać zaznaczona oraz skopiowana przez użytkownika w taki sam sposób jak treść elementu "div"</span>
</div>
</body>
</html>
Za pomocą wartości text właściwości user-select możemy sprawić, że treść interesującego nas elementu HTML może zostać zaznaczona oraz skopiowana przez użytkownika w dowolny sposób.
Przykład
user-select:text;
treść tego elementu "div" może zostać zaznaczona oraz skopiowana przez użytkownika w dowolny sposób, ponieważ do tego elementu "div" została dodana właściwość "user-select" wraz z wartością "text"
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>Darmowy Kurs CSS</title>
<style>
html {
font-size:16px;
font-family:Helvetica, sans-serif;
}
div {
user-select:text;
-moz-user-select:text;
-webkit-user-select:text;
-ms-user-select:text;
padding:1em;
font-size:1.3em;
background-color:#CBFFFF;
}
</style>
</head>
<body>
<div>
treść tego elementu "div" może zostać zaznaczona oraz skopiowana przez użytkownika w dowolny sposób, ponieważ do tego elementu "div" została dodana właściwość "user-select" wraz z wartością "text"
</div>
</body>
</html>
Za pomocą wartości none właściwości user-select możemy sprawić, że treść interesującego nas elementu HTML nie może zostać zaznaczona oraz skopiowana przez użytkownika.
Przykład
user-select:none;
treść tego elementu "div" nie może zostać zaznaczona oraz skopiowana przez użytkownika, ponieważ do tego elementu "div" została dodana właściwość "user-select" wraz z wartością "none"
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>Darmowy Kurs CSS</title>
<style>
html {
font-size:16px;
font-family:Helvetica, sans-serif;
}
div {
user-select:none;
-moz-user-select:none;
-webkit-user-select:none;
-ms-user-select:none;
padding:1em;
font-size:1.3em;
background-color:#CBFFFF;
}
</style>
</head>
<body>
<div>
treść tego elementu "div" nie może zostać zaznaczona oraz skopiowana przez użytkownika, ponieważ do tego elementu "div" została dodana właściwość "user-select" wraz z wartością "none"
</div>
</body>
</html>
Za pomocą wartości all właściwości user-select możemy sprawić, że treść interesującego nas elementu HTML może zostać zaznaczona oraz skopiowana przez użytkownika, lecz tylko w całości.
Przykład
user-select:all;
treść tego elementu "div" może zostać zaznaczona oraz skopiowana przez użytkownika, lecz tylko w całości, ponieważ do tego elementu "div" została dodana właściwość "user-select" wraz z wartością "all"
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>Darmowy Kurs CSS</title>
<style>
html {
font-size:16px;
font-family:Helvetica, sans-serif;
}
div {
user-select:all;
-moz-user-select:all;
-webkit-user-select:all;
-ms-user-select:all;
padding:1em;
font-size:1.3em;
background-color:#CBFFFF;
}
</style>
</head>
<body>
<div>
treść tego elementu "div" może zostać zaznaczona oraz skopiowana przez użytkownika, lecz tylko w całości, ponieważ do tego elementu "div" została dodana właściwość "user-select" wraz z wartością "all"
</div>
</body>
</html>
