Weiß jemand wie ich mit CSS den Radio Button beim anklicken des Buttons so blau bekomme?

1 Antwort

Bei Formularelementen wie dem Radio-Button handelt es sich um ein natives Element, dessen Aussehen durch das OS spezifiziert wird. Daher ist die direkte Einflussnahme auf diese Elemente / ihre Teilkomponenten oftmals sehr begrenzt.

Du kannst den Radio-Button mit Hilfe von CSS-Pseudoelementen überdecken.

Beispiel:

input[type=radio] {
  position: relative;
}

input[type=radio]::after {
  background-color: white;
  border: 1px solid;
  border-radius: 100%;
  content: "";
  display: inline-block;
  height: 11px;
  width: 11px;
}

input[type=radio]:checked::before {
  background-color: blue;
  border: 2px solid blue;
  border-radius: 100%;
  content: "";
  display: inline-block;
  height: 4px;
  left: 3px;
  position: absolute;
  top: 2px;
  width: 3px;
}