Farbe von markiertem Text ändern

Mit CSS ist es möglich, die Text- und Hintergrundfarbe von markiertem Text zu verändern. Wie das funktioniert möchte ich euch hier erklären.

Der „selection“-Selektor

Anpassungen von Textmarkierungen sind mit dem Selektor „selection“ möglich. Der CSS Code dafür sieht wie folgt aus:

::selection {
	background-color:#009245;
	color:#fff;
}

::-moz-selection {
	background-color:#009245;
	color:#fff;
}

Mit „background-color“ definiert man die Hintergrundfarbe. Mit „color“ die Farbe des Textes.

Browserkompabilität

Die Anpassung von Textmarkierungen mit „selection“ wird von Opera ab Version 9.5, Internet  Explorer ab Version 9, Firefox ab Version 3.6, Chrome und Safari unterstützt. Ursprünglich war der Selektor Teil der CSS3-Spezifikation. Mittlerweile ist er leider nicht mehr vorhanden, was dazu führt, dass er nicht valide ist.