HTML - Botones de radio

Los botones de radio se usan para permitirle al usuario elegir una de las opciones listadas. Para poder crear este tipo de campo, primero debemos darle un nombre que se usara para todo el grupo.

html<p>Elegir nacionalidad </p>
<p>
	Española: <input type="radio" name="citizenship" /><br />
	Rumana: <input type="radio" name="citizenship" /><br />
	Inglesa: <input type="radio" name="citizenship" />
</p>

Demo

Elegir nacionalidad

Española:
Rumana:
Inglesa:

Especificando un nombre para el grupo, al cual pertenece el campo, permitirá mostrar al navegador cómo diferenciar entre más de un grupo de botones radio dentro del mismo formulario, por lo tanto permitirá la elección de una única variante de respuesta para cada grupo y formulario.

html<p>Escoger nacionalidad </p>
<p>

	Inglesa: <input type="radio" name="citizenship" /><br />
	Española: <input type="radio" name="citizenship" /><br />
	Rumana: <input type="radio" name="citizenship" />
</p>

<p>Escoger genéro</p>
<p>
	Femenino: <input type="radio" name="sex" /><br />
	Masculino: <input type="radio" name="sex" />
</p>

Demo

Escoger nacionalidad

Inglesa:
Española:
Rumana:

Escoger genéro

Femenino:
Masculino:

HTML - Botones de radio seleccionados por defecto

Al igual que las casillas de verificación, los botones radio pueden ser seleccionados para facilitar el trabajo del usuario.

Elegir nacionalidad

Inglesa:
Rumana:
Española:

Cualquiera de estas opciones puede ser seleccionada, no necesariamente la ultima. Ademas, es bueno preseleccionar determinados respuestas con moderación y sólo cuando la información requerida no es de mayor importancia. Es posible que el usuario, sin prestar atención o por comodidad, elija la opción que ya ha sido seleccionada sin que esta sea la correcta para él en este caso.