<header>: Elemento HEADER
Última atualização: 2026-10-13
<header>Elemento HEADER
Representa conteúdo introdutório ou uma área de navegação, comumente usado no topo de uma página ou seção (título do site, logo, nav principal).
| Categoria | Semântico |
|---|---|
| Modelo de Conteúdo | Conteúdo de fluxo |
| Pais Permitidos | Qualquer elemento que aceite conteúdo de fluxo |
| Tag de Fechamento | Sim — requer fechamento </header> tag |
| Status | Padrão |
📝 Sintaxe
<header>conteúdo do cabeçalho</header>▶ Exemplo
Edite o código abaixo e veja o resultado em tempo real no playground:
🌐 Suporte de Navegadores
| Navegador |  Chrome |
 Edge |
 Firefox |
 Safari |
 Opera |
|---|---|---|---|---|---|
| <header> | ✓ v1 | ✓ v12 | ✓ v1 | ✓ v1 | ✓ v1 |
| Suportado em todos os navegadores principais | |||||
Dica： header descreve papel/posição, não confunda com head; uma página pode ter vários headers (ex.: um por artigo).
❓ Perguntas Frequentes
Qheader só pode existir uma vez por página?
ANão. O header de nível de página costuma ser único (no topo do body), mas cada
<article> e <section> pode ter o seu próprio <header> (com o título e metadados daquele trecho). Atenção: header não pode ser aninhado dentro de outro header ou footer.QQual é a diferença entre header e h1?
A
<h1> é o título em si; <header> é o «contêiner introdutório» — pode conter logo, campo de busca, navegação, grupo de títulos etc. h1 dentro de header é uma combinação comum, mas um header apenas com logo e navegação também é perfeitamente válido.QQual é a diferença entre header e head?
AElementos completamente distintos:
<head> é o contêiner de metadados do documento (invisível, recebe title/meta/link); <header> é a área de cabeçalho visível da página. Iniciantes costumam confundir — head escreve-se no topo do documento, header escreve-se no body.🏷️ Tags Relacionadas
💡 Casos Relacionados
📚 Tutoriais Relacionados
