<label>: Elemento LABEL

Última atualização: 2026-10-13

<label>Elemento LABEL

O elemento <label> define um rótulo para um controle de formulário. O atributo for o vincula ao id do controle; clicar no rótulo foca/ativa o controle, melhorando acessibilidade e experiência de toque.

CategoriaFormulários
Modelo de ConteúdoConteúdo de frase (sem <label> aninhado)
Pais PermitidosQualquer elemento que aceite conteúdo de frase
Tag de FechamentoSim — requer fechamento </label> tag
StatusPadrão

📝 Sintaxe

<label for="username">Usuário:</label>
<input type="text" id="username">

⚙️ Atributos

Este elemento suporta os atributos globais mais os seguintes:

AtributoValorDescrição
forElement IDThe ID of the associated form control.

▶ Exemplo

Edite o código abaixo e veja o resultado em tempo real no playground:

🌐 Suporte de Navegadores

Navegador ChromeChrome EdgeEdge FirefoxFirefox SafariSafari OperaOpera
<label> ✓ v1 ✓ v12 ✓ v1 ✓ v1 ✓ v1
Suportado em todos os navegadores principais

❓ Perguntas Frequentes

QPara que serve o atributo for de label?
Afor aponta para o id do campo, criando a associação explícita: clicar no texto do label foca/seleciona o campo, e o leitor de tela lê o label como nome do campo. Escrita: <label for='email'>E-mail</label><input id='email'>.
QEnvolvendo o input no label, dispensa-se o for?
ASim. Com o controle dentro do label, a associação é implícita e não precisa de for nem id; mas um label só pode envolver um controle. A associação implícita atrapalha layouts complexos (label e controle costumam ficar separados); o for explícito é mais flexível — não misture as duas formas no mesmo controle.
Qlabel pode conter títulos ou links?
ANão deve conter títulos (h1-h6) nem elementos interativos (links, botões). A semântica de label é «nome do controle»; aninhar interativos gera conflito de clique e leitura confusa no leitor de tela. Notas auxiliares ficam fora do label ou ligadas por aria-describedby.

📚 Tutoriais Relacionados

Web-Tutorial.com

Equipe Técnica Web-Tutorial

Uma plataforma de tutoriais mantida por diversos desenvolvedores. Cada tutorial é escrito e revisado por profissionais da área correspondente. Trabalhamos para manter nosso conteúdo preciso e confiável — se encontrar algum problema, avise-nos.

100%