Comme vous pouvez l’avez peut-être remarqué sur ce blog, il est possible de changer la couleur des sélections dans une page web avec les CSS. Pour créer cet effet sympa, qui ne fonctionne que sous Firefox et Safari, nous devront utiliser les sélecteurs non standardisés ::-moz-selection
pour le premier et ::selection
pour le second. Ils supportent tous deux les propriétés color
et background-color
.
Un petit example :
/* Le code pour Firefox / Gecko */
::-moz-selection {
color: white;
background-color: #379CB3;
}
/* Le code pour Safari / Webkit */
::selection {
color: white;
background-color: #379CB3;
}
Vous pouvez aussi changer les couleurs de la sélection pour un élément particulier. Par exemple span::-moz-selection
pour les navigateurs basés sur le moteur de rendu Gecko et span::selection
pour ceux utilisant Webkit n’affectera que le texte encadré de la balise HTML <span>
.