Zurück zur Übersicht

19. Februar 2021

Eigene Checkboxen: Der Checkbox Hack

Checkboxen ganz individuell zu stylen ist ein Hingucker auf Webseiten – und kann die Benützbarkeit verbessern. Das Problem ist – die Browser lassen Ihr Standard-Stylesheet für input Felder nicht überschreiben.. Manche Browser erlauben es Weite und Höhe zu verändern – aber wenn wir den Hintergrund oder die Checkmark austauschen wollen – ist Schluss.

Beim klassischen Checkbox Hack nutzen wir darum die :.before und :.after Elemente – und formen daraus eine neue Checkbox

See the Pen
CSS Wizard: Custom Checkbox by CSS Wizard (@boiiiiiiiing)
on CodePen.