::selection

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à.

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

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

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