La etiqueta “fieldset” suele usarse principalmente en formularios para poder agrupar campos que están relacionados entre sí. Aunque también podemos utilizarlo para agrupar una serie de definiciones o de textos relacionados entre sí.

Fieldset se escribe con la etiqueta <fieldset> y su cierre (</fieldset>). Debemos advertir que tanto la etiqueta de apertura como la de cierre son obligatorias. El efecto que conseguimos gracias a la etiquetas fieldset es un rectángulo enmarcando el texto que esté incluido dentro de él.

Hay una cosa importante que debemos tener en cuenta del fieldset: Éste se ensanchará todo lo que pueda en la página. Es decir, su ancho por naturaleza será del 100%. Si queremos darle una anchura predeterminada o limitar su expansión lo que deberemos hacer incluir la etiqueta dentro de una tabla a la que sí le indicaremos la anchura que queremos darle.

A continuación vamos a ofrecerte un fieldset básico, sin limitación ninguna:

Y aquí puedes apreciar como quedará en nuestra página:

Y a continuación te mostramos el código de un fieldset incluido dentro de una tabla, con una anchura del 75% y alineada al centro:

Obteniendo el siguiente resultado:

Legend

La etiqueta “legend” nos resulta muy útil dentro de la etiqueta fieldset. Legend nos permite titular o etiquetar el conjunto de campos que están incluidos dentro de legend. Por ejemplo, si el conjunto de datos son los datos personales de la persona, en legend escribiremos “Datos personales”.

Legend se abre con la etiqueta <legend> y se cierra con </legend>. Por supuesto, estas dos etiquetas deben estar dentro de la etiqueta <fieldset>.

Podemos alinear el título del legend como queramos, mediante el parámetro “align”. En la siguiente muestra veremos un fieldset con su etiqueta alineada al centro:

Y la muestra es la siguiente:

Artículo escrito por Alberto Gómez para HazUnaweb.com. Queda absolutamente prohibida su reproducción.