Resumo
O elemento <main>
define o conteúdo principal dentro do
{{HTMLElement("body")}} em seu documento ou aplicação. Entende-se como conteúdo principal aquele relacionado diretamente com o tópico central da página ou com a funcionalidade central da aplicação. O mesmo deverá ser único na página, ou seja, dentro do elemento <main> não deverão ser incluidas seções da página que sejam comuns a todo o site ou aplicação, tais como mecanismos de navegação, informações de copyright, logotipo e campos de busca
(a não ser, é claro, caso a função principal do documento seja fazer algum tipo de busca).
Nota: <main>
não pode ser filho dos elementos {{HTMLElement("article")}}, {{HTMLElement("aside")}}, {{HTMLElement("footer")}}, {{HTMLElement("header")}}, ou {{HTMLElement("nav")}}.
Autores não devem incluir mais de um elemento main no mesmo documento.
- Categorias de conteúdoConteúdo de fluxo, conteúdo palpável.
- Conteúdo permitido Conteúdo de fluxo.
- Omissão de tag Nenhuma; ambas as tags de início e fim são obrigatórios.
- Elementos pais permitidos Qualquer elemento que aceite conteúdo de fluxo, mas não pode ser filho dos elementos {{HTMLElement("article")}}, {{HTMLElement("aside")}}, {{HTMLElement("footer")}}, {{HTMLElement("header")}}, ou {{HTMLElement("nav")}}.
- DOM interface {{domxref("HTMLElement")}}
Atributos
Este elemento admite apenas os atributos globais.
Exemplo
<!-- outro conteúdo --> <main> <h1>Maçãs</h1> <p>A maçã é a fruta pomácea da macieira.</p> <article> <h2>Vermelho delicioso</h2> <p>Estas maçãs vermelhas brilhantes são as mais comumente encontradas em muitos supermercados.</p> <p>... </p> <p>... </p> </article> <article> <h2>Granny Smith</h2> <p>Essas suculentas maçãs verdes, são um ótimo recheio para torta de maçã.</p> <p>... </p> <p>... </p> </article> </main> <!-- outro conteúdo -->
Especificações
Especificação | Estado | Comentário |
---|---|---|
{{SpecName('HTML WHATWG', '#the-main-element', '<main>')}} | {{Spec2('HTML WHATWG')}} | Removida a restrição sobre não usar <main> como um filho dos elementos {{HTMLElement("article")}}, {{HTMLElement("aside")}}, {{HTMLElement("footer")}}, {{HTMLElement("header")}}, ou {{HTMLElement("nav")}}. |
{{SpecName('HTML5.1', 'grouping-content.html#the-main-element', '<main>')}} | {{Spec2('HTML5.1')}} | Não há mudança na {{SpecName('HTML5 W3C')}} |
{{SpecName('HTML5 W3C', 'grouping-content.html#the-main-element', '<main>')}} | {{Spec2('HTML5 W3C')}} | Definição inicial. |
Navegadores compatíveis
O elemento <main> é amplamente suportado (exceto pelo Internet Explorer). Sugere-se que, até que o elemento <main> seja suportado pelo Internet Explorer, adicione a ele o atributo role com o valor "main":
<main role="main"> ... </main>
{{CompatibilityTable}}
Feature | Chrome | Firefox (Gecko) | Internet Explorer | Opera | Safari (WebKit) |
---|---|---|---|---|---|
Suporte básico | Chrome 26 | {{ CompatGeckoDesktop("21.0") }} | {{CompatNo()}} | Opera 16 | Safari 7 |
Feature | Android | Firefox Mobile (Gecko) | IE Phone | Opera Mobile | Safari Mobile |
---|---|---|---|---|---|
Suporte básico | {{CompatNo()}} | {{ CompatGeckoMobile("21.0") }} | {{CompatNo()}} | {{CompatNo()}} | {{CompatNo()}} |
Veja também
- Elementos estruturais básicos: {{HTMLElement("html")}}, {{HTMLElement("head")}}, {{HTMLElement("body")}}
- Elementos relacionados a seções: {{HTMLElement("article")}}, {{HTMLElement("aside")}}, {{HTMLElement("footer")}}, {{HTMLElement("header")}}, or {{HTMLElement("nav")}}