Pourquoi est-il impossible de modifier la couleur de la boîte à cocher indépendamment des modifications de code?

Malgré les efforts pour personnaliser la couleur d'arrière-plan des cases à travers CSS, de nombreux utilisateurs rencontrent un manque de modifications visibles. Ce problème a été répandu dans Firefox 29 et plus tard.

Explication

L'incapacité de modifier la couleur de la case à cocher découle d'une omission délibérée de cette fonctionnalité dans HTML. Les cases à cocher et les boutons radio sont considérés comme des éléments de forme «natifs», ce qui signifie que leur apparence est régie par le navigateur plutôt que les règles CSS. Les navigateurs hiérarchisent la cohérence dans l'interface utilisateur et appliquent donc les propriétés visuelles par défaut pour ces éléments. Property:

accent-Color

accent-color

Démonstration

#cb1 {
  accent-color: #9b59b6; /* Change the color of the check mark within checkbox #cb1 to blue */
}

# cb1 { Color accent: # 9b59b6; } # CB2 { Color accent: # 34495E; } # CB3 { Color accent: # E74C3C; }