<nav>: Elemento NAV
Última atualização: 2026-10-13
<nav>Elemento NAV
Representa uma seção de links de navegação principais, como navegação primária, breadcrumbs ou paginação.
| 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 </nav> tag |
| Status | Padrão |
📝 Sintaxe
<nav>links de navegação</nav>
▶ Exemplo
Edite o código abaixo e veja o resultado em tempo real no playground:
🌐 Suporte de Navegadores
| Navegador | |||||
|---|---|---|---|---|---|
| <nav> | ✓ v1 | ✓ v12 | ✓ v1 | ✓ v1 | ✓ v1 |
| Suportado em todos os navegadores principais | |||||
Dica: Nem todo grupo de links precisa de nav; reserve-o para a navegação principal.
❓ Perguntas Frequentes
QQual é a diferença entre nav e uma navegação com ul e li?
A
<nav> fornece a semântica de «landmark de navegação», listável e acessível direto pelo leitor de tela; internamente costuma-se usar <ul><li> para organizar os links. Um <ul> sozinho é só uma lista, sem semântica de navegação. Estrutura convencional: <nav><ul><li><a>Link</a></li></ul></nav>.QA página pode ter vários nav?
ASim. Navegação principal, breadcrumbs, grupo de links do rodapé e sumário do artigo podem ser cada um um
<nav>; mas não é preciso embrulhar todos os links — embrulhe apenas os blocos principais de navegação e dê a cada nav um aria-label (como «Navegação principal», «Breadcrumbs») para diferenciá-los.QTodos os links precisam ficar dentro de nav?
ANão. A especificação recomenda
<nav> apenas para «blocos principais de navegação»; links comuns no corpo do texto não precisam, e links secundários no rodapé também podem dispensar o nav segundo a especificação. Abusar de nav dilui a semântica de landmark.🏷️ Tags Relacionadas
💡 Casos Relacionados
Mais estudos de caso em breve — volte mais tarde.