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

Sommario

Lo pseudo-elemento CSS ::selection applica regole alla porzione di un documento che è stato evidenziato (es. con il mouse o con altri dispositivi di puntamento) dall'utente.

Solo un piccolo sottoinsieme di proprietà CSS possono essere usati in una regola che usa ::selection nel suo selettore: color, background-color, cursor, outline, text-decoration, text-emphasis-color and text-shadow. Si noti, in particolare, che background-image viene ignorato, come qualsiasi altra proprietà.

text-shadow in ::selection è supportato da Chrome, Safari e Firefox 17+.

Benché presente nelle bozze dei selettori CSS di livello 3, questo pseudo-elemento fu rimosso durante la fase del Candidate Recommendation, in quanto il suo comportamento apparve come insufficiente, specialmente negli elementi nidificati, e la sua interoperabilità non venne raggiunta. (based on discussion in the W3C Style mailing list).

Lo pseudo-elemento ::selection venne in seguito riaggiunto in Pseudo-Elements Level 4.

Esempio

Gecko è l'unico motore che richiede il prefisso. A causa del fatto che le regole di analisi CSS richiedono l'abbandono dell'intera regola quando si incontra uno pseudo-elemento non valido, devono essere scritte due regole distinte: ::-moz-selection, ::selection {...}. La regola verrà eliminata sui browser non-Gecko in quanto ::-moz-selection non è valido per questi ultimi.

HTML

<div>Ecco un po' di testo per testare la pseudo-classe di ::selection.</div>
<p>Prova anche questo testo per <p></p>

CSS

/* rende giallo qualsiasi testo selezionato, su sfondo rosso  */
::-moz-selection {
  color: gold; background: red;
}

::selection {
  color: gold; background: red;
} 

/* rende bianco il testo selezionato, su sfondo nero */
p::-moz-selection {
  color: white;
  background: black;
}

p::selection {
  color: white;
  background: black;
}

Output

Specificazioni

Specificazione Status Commento
CSS Pseudo-Elements Level 4
The definition of '::selection' in that specification.
Working Draft Initial definition

Lo pseudo-elemento ::selection ma questo venne rimosso prima di poter raggiungere lo status di Recommendation. Venne in seguito riaggiunto come parte delle bozze degli pseudo-elementi di livello 4.

Compatibilità nei Browser

We're converting our compatibility data into a machine-readable JSON format. This compatibility table still uses the old format, because we haven't yet converted the data it contains. Find out how you can help!

Caratteristica Chrome Edge Firefox (Gecko) Internet Explorer Opera Safari
Supporto di base 1 (Yes) 1.0 -moz[1] 9 9.5 1.1
Caratteristica Android Chrome for Android Edge Firefox Mobile (Gecko) IE Mobile Opera Mobile Safari Mobile
Supporto di base ? ? (Yes) ? ? ? ?

[1] Attualmente Gecko supporta solamente la versione prefissata ::-moz-selection. Sarà resa senza prefisso in bug 509958.

Tag del documento e collaboratori

Hanno collaborato alla realizzazione di questa pagina: Winni-, Swear
Ultima modifica di: Winni-,