::selection

El pseudo-element CSS ::selection aplica estils a la part d'un document que l'usuari ha ressaltat (com ara amb el ratolí).

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

Només un petit subconjunt de propietats CSS es pot utilitzar amb el pseudo-element ::selection:

• color
• background-color
• cursor
• outline
• text-decoration
• text-emphasis-color
• text-shadow

Tingueu en compte que, en particular, s'ignora background-image.

Sintaxi

/* Firefox syntax */
::-moz-selection

::selection

Exemple

HTML

<div>This text has special styles when you highlight it.</div>
<p>Also try selecting text in this paragraph.</p>

CSS

/* Make selected text gold on a red background */
::-moz-selection {
  color: gold;
  background: red;
}

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

/* Make selected text in a paragraph white on a blue background */
p::-moz-selection {
  color: white;
  background: blue;
}

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

Resultat

Especificacions

Navegadors compatibles

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!

[1] Gecko actualment només és compatible amb la versió prefixada ::-moz-selection. Serà sense prefix en errada 509958.