<section>

O elemento HTML <section> representa uma seção genérica contida em um documento HTML, geralmente com um título, quando não existir um elemento semântico mais específico para representá-lo.

Por exemplo, um menu de navegação deve estar dentro um elemento <nav>, mas uma lista de resultados de pesquisa ou a exibição de um mapa e seus controles não possuem elementos específicos, e podem ser colocados dentro de uma <section>.

Categorias de conteúdo Conteúdo de fluxo , conteúdo de seção, conteúdo palpável.
Conteúdo permitido Conteúdo de fluxo.
Omissão de tags Sem omissão de tags
Tags-pai permitidas Qualquer elemento que aceite conteúdo de fluxo. Note que um elemento <section> não deve ser um descendente de um elemento <address>.
Regras ARIA permitidas alert, alertdialog, application, banner, complementary, contentinfo, dialog, document, feed, log, main, marquee, navigation, search, status, tabpanel
Interface DOM HTMLElement

Atributos

Este elemento inclui apenas os atributos globais.

Notas de uso

  • Cada <section> deve ser identificado, geralmente incluindo um cabeçalho (elemento <h1> (en-US)-<h6> (en-US)) como um filho do elemento <section>.
  • Se faz sentido distribuir separadamente o conteúdo de um elemento <section>, use um elemento <article> em seu lugar.
  • Não use o elemento <section> como um container genérico; para isso que a <div> serve, especialmente quando a seção é apenas com propósito de estilização. Uma regra de ouro é ,"usar quando uma seção deve aparecer logicamente na estrutura de um documento".

Exemplo 1

Antes

<div>
  <h1>Cabeçalho</h1>
  <p>Um monte de conteúdo incrível</p>
</div>

Depois

<section>
  <h1>Cabeçalho</h1>
  <p>Um monte de conteúdo incrível</p>
</section>

Exemplo 2

Antes

<div>
  <h2>Cabeçalho</h2>
  <img src="passaro.jpg" alt="pássaro" />
</div>

Depois

<section>
  <h2>Cabeçalho</h2>
  <img src="passaro.jpg" alt="pássaro" />
</section>

Especificações

Especificação Status Comentários
HTML Living Standard
The definition of '<section>' in that specification.		 Padrão em tempo real
HTML 5.1
The definition of '<section>' in that specification.		 Recomendação
HTML5
The definition of '<section>' in that specification.		 Recomendação

Compatibilidade com navegadores

BCD tables only load in the browser

Veja também