Ejemplo 1: cambiar el color del botón de opción
input[type="radio"] {
-webkit-appearance:none;
width:20px;
height:20px;
border:1px solid darkgray;
border-radius:50%;
outline:none;
box-shadow:0 0 5px 0px gray inset;
}
input[type="radio"]:hover {
box-shadow:0 0 5px 0px orange inset;
}
input[type="radio"]:before {
content:'';
display:block;
width:60%;
height:60%;
margin: 20% auto;
border-radius:50%;
}
input[type="radio"]:checked:before {
background:green;
}
Ejemplo 2: cómo cambiar el color de un botón de radio
input[type="radio"]:after {
width: 15px;
height: 15px;
border-radius: 15px;
top: -2px;
left: -1px;
position: relative;
background-color: #d1d3d1;
content: '';
display: inline-block;
visibility: visible;
border: 2px solid white;
}
input[type="radio"]:checked:after {
width: 15px;
height: 15px;
border-radius: 15px;
top: -2px;
left: -1px;
position: relative;
background-color: #ffa500;
content: '';
display: inline-block;
visibility: visible;
border: 2px solid white;
}
¡Haz clic para puntuar esta entrada!
(Votos: 0 Promedio: 0)