martes, 7 de febrero de 2017

FORMULARIOS EN HTML - PARTE II



En la actividad anterior "FORMULARIOS EN HTML - PARTE I "se te proponía realizar el siguiente formulario:

Crea una página web que contenga un formulario con los siguientes campos de información:
  • El nombre, con un control de tipo texto.
  • Los apellidos, con un control de tipo texto.
  • El sexo, con dos opciones excluyentes hombre o mujer.
  • El correo electrónico, con un control de tipo texto.
  • Una casilla de verificación con el texto "Deseo recibir información sobre novedades y ofertas".
  • Una casilla de verificación con el texto "Declaro haber leido y aceptar las condiciones generales del programa y la normativa sobre protección de datos".
  • Un botón de envío.
Además, tienes que tener en cuenta los siguientes requisitos:
  • El título de la página debe ser Formulario de registro - Mi web.
  • El método de envío del formulario debe ser GET.
  • El destino del envío del formulario debe ser "".
  • La longitud máxima de entrada de datos de los controles para el nombre y los apellidos debe ser 50 caracteres.
  • La casilla de verificación con el texto "Deseo recibir información sobre novedades y ofertas" debe estar activada por defecto.

Al formulario anterior le tienes que añadir los siguientes campos de información:
  • Población, una lista desplegable con las opciones Alicante, Madrid, Sevilla y Valencia.
  • Descripción, un área de texto multilínea.
Además, tienes que asociar la etiqueta de cada control a su control para mejorar la usabilidad y la accesibilidad.





<title>Formulario de registro - Mi web</title>



<h1>Formulario de registro</h1>

<form action="" method="get">
<p>
<label for="nombre">Nombre:</label> <input type="text" name="nombre" id="nombre" maxlength="50">
</p>

<p>
<label for="apellidos">Apellidos:</label> <input type="text" name="apellidos" id="apellidos" maxlength="50">
</p>
<p>
Sexo: <input type="radio" name="sexo" id="sexo-h" value="h"> <label for="sexo-h">hombre</label> <input type="radio" name="sexo" id="sexo-m" value="m"> <label for="sexo-m">mujer</label>
</p>

<p>
<label for="correo">Correo:</label> <input type="text" name="correo" id="correo" maxlength="100">
</p>


<p>
<label for="poblacion">Población:</label>
<select name="poblacion" id="poblacion">
<option>Alicante</option>
<option>Madrid</option>
<option>Sevilla</option>
<option>Valencia</option>
</select>
</p>

<p><label for="descripcion">Descripción:</label>
<textarea name="descripcion" id="descripcion" rows="6" cols="60"></textarea>
</p>
<p>
<input type="checkbox" name="info" id="info" checked="checked"> <label for="info">Deseo recibir información sobre novedades y ofertas</label>
</p>
<p>
<input type="checkbox" name="condiciones" id="condiciones"> <label for="condiciones"> Declaro haber leido y aceptar las condiciones generales del programa y la normativa sobre protección de datos</label>
</p>

<p>
<input type="submit" value="Enviar">
</p>
</form>



FUENTE: GUZMAN FERNANDEZ GARCIA




No hay comentarios.:

Publicar un comentario