Farbe von markiertem Text anpassen [CSS Selection]
In den meisten Browsern ist die Farbe des markierten Textes standardmäßig eine weiße Schrift auf blauem Hintergrund. Per CSS lassen sich jedoch die Farben anpassen. Wie es lesbarer geht, verraten wir hier.
Manchmal kann es störend wirken, wenn mit der Mouse einen Text auf einer Website markiert. Das grelle Blau will einfach nicht zum Rest der Seite passenen. Abhilfe schafft hier CSS.
Mit dem „selection“-Selektor lässt sich die Vorder- und Hintergrundfarbe des markierten Textes festlegen:
::-moz-selection { background: #111; color: #fff; }
::selection { background: #111; color: #fff; }
Unterstützt werden die Eigenschaften „color“, „background“ (hier lediglich: „background-color“, „background-image“) und „text-shadow“.
Verwendung des „selection“-Selektors auf Websites
Der „selection“-Selektor funktioniert in allen modernen Browsern. Einige sehr alte Versionen vom Internet Explorer können mit den Pseudo-Elementen nichts anfangen. Auch bei Safari auf iOS funktioniert die farbliche Unterlegung nicht. Mehr Infos zur Unterstützung in den Browsern findet man hier.
Zu erwähnen ist außerdem, dass der „selection“-Selektor zwar eine breite Unterstützung auf Browserbasis erfährt, aber dennoch nicht als „valide“ eingestuft wird.
