Elemento fieldset en HTML

El elemento html fieldset se utiliza para agrupar varios elementos y banners (label) en un formulario en un documento HTML. Esto hace que sus formularios sean más fáciles de usar y más claros.

Un ejemplo de uso del elemento <fieldset> en el que el elemento es su <legend> primer child, y los dos elementos <input> y <label>:

< form  action = "test.php"  method = "post" > 
  < fieldset > 
    < legend > título </ legend > 
    < input  type = "radio"  id = "radio" > 
    < label  for = "radio" > haga clic aquí </ label > 
    < input type = "enviar" valor = "enviar" > 
   </ fieldset > 
</ form >

Etiqueta html fieldset

Clasificaciones de contenido	Un elemento organizativo, un elemento divisional y un elemento relacionado con el modelo.
Contenido permitido	Un elemento `<legend>` opcional seguido de contenido normal.
Acrónimo	Las etiquetas de inicio o finalización no se pueden omitir.
Elementos del padre	Cualquier elemento que acepte contenido normativo.
Interfaz DOMO	`HTMLFieldSetElement`

Soporte de navegadores

Chrome	Firefox	Edge	Safari	Ópera
Soportado	Soportado	Soportado	Soportado	Soportado

La función form no se admite en ningún navegador importante en el momento en que se escribió esta página.

Características

En este elemento html fieldset se pueden utilizar propiedades globales.

`disabled`

Si se establece esta propiedad booleana, todos los hijos del modelo están deshabilitados, excepto los hijos del elemento <legend> opcional.

Los elementos deshabilitados son elementos no modificables que no recibirán eventos como clics del mouse o foco, y los navegadores generalmente los muestran en plateado.

Ejemplo de uso de la propiedad disabled para deshabilitar todos los campos dentro del elemento <fieldset>:

< form  action = "test.php"  method = "post" > 
  < fieldset  deshabilitado > 
    < legend > título </ legend > 
    < input  type = "radio"  id = "radio" > 
    < label  for = "radio" > haga clic aquí </ label > 
    < input type  = "enviar" valor = "enviar" ></ fieldset > 
</ form >

`form`

Esta propiedad es el valor de propiedad del id elemento con el <form> que está relacionado este elemento, el valor predeterminado es el valor de propiedad del elemento padre id más cercano <form> de ese elemento.

Un ejemplo del uso de la propiedad form para especificar qué forma debe seguir un elemento <fieldset>:

< form  action = "test.php"  method = "post"  id = "form1" > 
</ form > 
< fieldset  form = "form1" > 
  < legend > título </ legend > 
  < input  type = "radio"  id = " radio " > 
    < label  for = " radio " > haga clic aquí </ label > 
    < input type  = "enviar" value = "enviar" > 
</ fieldset >

`name`

El nombre asociado con este grupo.

< fieldset  name = "myset" > 
  < legend > Título </ legend > 
  < input  type = "radio"  id = "radio" > 
  < label  for = "radio" > Haz clic en mí </ label > 
  < input  type = "submit" > 
</ fieldset >

Formato predeterminado

La mayoría de los navegadores muestran el elemento de <fieldset> establecer la propiedad display de block, y el establecimiento de márgenes ( margin-left y margin-right), las notas al pie ( padding-top, padding-right, padding-bottom y padding-left), y el marco ( border-width, border-style, border-color y border-image):

fieldset { 
  display: block;
  margin-left: 2px;
  margin-right: 2px;
  padding-top: 0.35em;
  padding-bottom: 0.625em;
  padding-left: 0.75em;
  padding-right: 0.75em;
  border-width: 2px;
  border-style: groove;
  border-color: threedface;
  border-image: initial;
}