MDN wants to talk to developers like you: https://qsurvey.mozilla.com/s3/8d22564490d8

user-select

Questa traduzione è incompleta. Collabora alla traduzione di questo articolo dall’originale in lingua inglese.

This is an experimental technology
Because this technology's specification has not stabilized, check the compatibility table for the proper prefixes to use in various browsers. Also note that the syntax and behavior of an experimental technology is subject to change in future versions of browsers as the spec changes.

Il selettore user-select controlla la corrente operazione di selezione.  Una proprietà simile chiamata user-focus fu proposta nelle prime bozze del css3-ui ma è stata respinta dal working group.
 

Note: Controlla la tabella delle compatibilità per sapere quali prefissi sono necessari per l'utilizzo

Initial valuenone
Applies toall elements
Inheritedno
Mediavisual
Computed valueas specified
Animatableno
Canonical orderthe unique non-ambiguous order defined by the formal grammar

Sintassi

user-select: none;
user-select: auto;
user-select: text;
user-select: contain;
user-select: all;

-moz-user-select: none;
-moz-user-select: text;
-moz-user-select: all;

-webkit-user-select: none;
-webkit-user-select: text;
-webkit-user-select: all; /* does not work in Safari, use only "none" or "text", or else it will allow to type in the html container*/

-ms-user-select: none;
-ms-user-select: text;
-ms-user-select: element;
none
Il testo dell'elemento e dei suoi sub-elements non possono essere selezionati. Questo è un valore molto importante della proprietà user-select. Può essere utile per migliorare la user interface, rendendo non selezionabile il contenuto di un bottone o il testo di un user interface che non è destinato a essere selezionato.
auto
Il testo sarà selezionato in base alle proprietà predefinite del browser.
text
Il testo può essere selezionato dall'utente.
-moz-none
The text of the element and sub-elements will appear as if they cannot be selected. Selection can contain these elements. Selection can be re-enabled on sub-elements using -moz-user-select:text. Starting with Firefox 21 none behaves like -moz-none.
all
In un editor HTML, se un evento click o doppio-click si verifica, l'elemento antenato più alto sarà selezionato. Se per esempio si seleziona un elemento figlio di un elemento genitore con proprietà user-select: all allora verrà selezionato tutto il contenuto dell'elemento genitore.
contain
element (IE-specific alias)
Enables selection to start within the element; however, the selection will be contained by the bounds of that element. Supported only in Internet Explorer.

Note: One of the differences between browser implementations is inheritance. In Firefox, -moz-user-select is not inherited by absolutely positioned elements, but in Safari and Chrome, -webkit-user-select is inherited by those elements.

auto | text | none | contain | all

Esempi

.unselectable {
  -moz-user-select: none;
  -webkit-user-select: none;
  -ms-user-select: none;
}
<body>
  <p class="unselectable">The user is not able to select this text in Firefox, Chrome, Safari and IE.</p>
</body>

Speficiche

Specification Status Comment
CSS Basic User Interface Module Level 4
The definition of 'user-select' in that specification.
Working Draft Initial definition. Also defined -webkit-user-select as a deprecated alias of user-select.

Compatibilità tra i browsers

Feature Chrome Edge Firefox (Gecko) Internet Explorer Opera Safari (WebKit)
Basic support 6.0-webkit- (Yes)-ms--webkit- (Yes)-moz- 10-ms- 15.0-webkit- 3.1-webkit-
element No support (Yes) No support (Yes) ? No support
Feature Android Firefox Mobile (Gecko) IE Phone Opera Mobile Safari Mobile
Basic support 2.1 ? 10(Yes)-ms-
11-webkit-
No support 3.2(Yes)
element ? ? ? ? ?

Vedi anche

Tag del documento e collaboratori

 Hanno collaborato alla realizzazione di questa pagina: ExplosiveLab
 Ultima modifica di: ExplosiveLab,