--- title: slug: Web/HTML/Elemento/label translation_of: Web/HTML/Element/label ---

Resumen

El Elemento HTML <label> representa una etiqueta para un elemento en una interfaz de usuario. Este puede estar asociado con un control ya sea mediante la utilizacion del atributo for, o ubicando el control dentro del elemento label. Tal control es llamado "el control etiquetado" del elemento label.

Categorias Contenido de flujo, contenido de fraseo, contenido interactivo, elemento de formulario asociado, contenido palpable.
Contenido permitido Contenido de fraseo, pero no otros componentes label ni otros elementos etiquetables a parte del de control ya etiquetado.
Omision del Tag {{no_tag_omission}}
Elementos padre permitidos Cualquier elemento que acepte el contenido de fraseo.
DOM interface {{domxref("HTMLLabelElement")}}

Atributos

Este elemento incluye los atributos globales.

{{htmlattrdef("accesskey")}} {{HTMLVersionInline("4")}} {{HTMLVersionInline("5")}}: Una tecla de atajo para acceder a este elemento desde el teclado.
{{htmlattrdef("for")}}: El ID del elemento de formulario etiquetable relacionado en el mismo documento que el elemento label. El primer elemento en el documento con tal ID que coincida con el dispuesto en el atributo for será el control etiquetado para este elemento.; Nota: Un elemento label puede contener ambos; El atributo for y el elemento de control anidado, siempre y cuando el atributo for apunte al mismo elemento.
{{htmlattrdef("form")}} {{HTMLVersionInline("5")}}: El formulario con el cual el label está asociado (su formulario dueño). El valor de este atributo debe ser un ID del elemento {{HTMLElement("form")}} en el mismo documento. Si este atributo no es especificado, este elemento <label> deberia ser descendiente de un elemento {{HTMLElement("form")}}. Este atributo permite ubicar el elemento label en cualquier lugar dentro del documento y no solo como descendiente de su respectivo formulario.

Ejemplos

<!-- Un simple ejemplo de un label con el atributo for -->
<label for="Name">Click me</label>
<input type="text" id="Name" name="Name" />

<!-- Aun mas simple -->
<label>Click me <input type="text" id="Name" name="Name" /></label>

Resultado

Click me

Especificaciones

Especificacion	Estado	Comentario
{{SpecName('HTML WHATWG', 'forms.html#the-label-element', '<label>')}}	{{Spec2('HTML WHATWG')}}
{{SpecName('HTML5 W3C', 'forms.html#the-label-element', '<label>')}}	{{Spec2('HTML5 W3C')}}
{{SpecName('HTML4.01', 'interact/forms.html#h-17.9.1', '<label>')}}	{{Spec2('HTML4.01')}}

Compatibilidad

Caracteristica	Chrome	Firefox (Gecko)	Internet Explorer	Opera	Safari
Soporte basico	{{compatversionunknown}}	{{compatversionunknown}}	{{compatversionunknown}}	{{compatversionunknown}}	{{compatversionunknown}}

Caracteristica	Android	Firefox Mobile (Gecko)	IE Mobile	Opera Mobile	Safari Mobile
Soporte basico	{{compatversionunknown}}	{{compatversionunknown}}	{{compatversionunknown}}	{{compatversionunknown}}	{{compatversionunknown}}

Notes

Click events in nested `<label>` elements

Starting with Gecko 8.0 {{geckoRelease("8.0")}}, a bubbling click event triggers at most one <label>, and the synthetic click event cannot trigger additional <label>s. In Gecko, a click event will still bubble up past a <label>, while in WebKit or Internet Explorer the click event will stop at the <label>. The behavior prior to Gecko 8.0 (triggering multiple <label>s) caused Firefox to stop responding (see {{bug(646157)}}).