341
Aprender a programar desde cero / Re:Php-¿Cómo se puede presentar en pantalla el simbolo a marcar de control radio?
« en: 16 de Febrero 2017, 00:21 »
Buenas.
En realidad es una imagen.
Pero hacer algo así con php sería muy trabajoso, es mucho más fácil con css. Te dejo un pequeño ejemplo:
He creado esta imagen:
![](http://i.imgur.com/CHcP084.png)
Y luego con este código creas el efecto para cuando se pulsa una u otra opción:
Saludos.
En realidad es una imagen.
Pero hacer algo así con php sería muy trabajoso, es mucho más fácil con css. Te dejo un pequeño ejemplo:
He creado esta imagen:
![](http://i.imgur.com/CHcP084.png)
Y luego con este código creas el efecto para cuando se pulsa una u otra opción:
Código: [Seleccionar]
<!DOCTYPE html>
<html>
<head>
<title>https://www.aprenderaprogramar.com</title>
<meta charset="UTF-8" />
<style>
input[type="radio"]{
display: none;
}
label {
padding-left: 1.7em;
background: url('http://i.imgur.com/CHcP084.png') no-repeat top left;
background-size: 16px 32px;
}
input[type="radio"] + label {
background-position: 0 0px;
width: 30px;
height: 30px;
}
input[type="radio"]:checked + label {
background-position: 0 -15px;
width: 30px;
height: 30px;
}
</style>
</head>
<body>
<form>
<input type="radio" name="option1" id="radio1" checked />
<label for="radio1">Uno</label>
<br/>
<input type="radio" name="option1" id="radio2" />
<label for="radio2">Dos</label>
<br/>
<input type="radio" name="option1" id="radio3" />
<label for="radio3">Tres</label>
<br/>
<input type="radio" name="option1" id="radio4" />
<label for="radio4">Cuatro</label>
</form>
</body>
</html>
Saludos.
![Sonreir ;D](https://aprenderaprogramar.com/foros/Smileys/default/grin.gif)