Se 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>
<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:
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':
No hay comentarios:
Publicar un comentario