martes, 17 de agosto de 2010

Formularios: conjunto de campos, etiqueta 'fieldset' y 'legend'

logo COEPASe usan dentro de un formulario para agrupar campos de entrada de datos relacionados, entre las etiquetas '<fieldset>' y '</fieldset>' se definen los campos de entrada. Justo después de la etiqueta de apertura '<fieldset>' y usa la etiqueta '<legend>Texto que identifica el 'fieldset'</legend>' para identificar los datos del 'fieldset'.

Posteriormente, seguiremos usando la etiqueta <label> para identificar cada uno de los campos de entrada:

<form method="post" action="http://..../validar.php">
<fieldset>
<legend>Datos personales</legend>
<label for="v-nombre">Nombre: </label>
<input type="text" name="v-nombre" /><br />

<label for="v-apellidos">Apellidos: </label>
<input type="text" name="v-apellidos" /><br />

<label for="v-email">Email: </label>
<input type="text" name="v-email" /><br />

<label for="pass">Contraseña: </label>
<input type="password" name="pass" /><br />
</fieldset><br />
<input type="submit" name="enviar" value="Enviar" /> <input type="reset" name="borrar" value="Borrar todo" /><br />
</form>

Y los campos de entrada dentro del 'fieldset' se mostrarán como se puede ver a continuación:

Datos personales





Se pueden poner varios 'fieldset' dentro de un mismo formulario para así ir agrupando dentro de cada uno campos de entrada del mismo tipo: datos personales, aficiones, etc

Otro ejemplo con varios 'fieldset':

Mantenimiento de clientes

Datos identificativos
Datos bancarios
Tipo de pago
Forma de pago

No hay comentarios:

Publicar un comentario