Please note, this is a STATIC archive of website developer.mozilla.org from 03 Nov 2016, cach3.com does not collect or store any user information, there is no "phishing" involved.

Revision 987249 of <section>

  • Slug da revisão: Web/HTML/Element/section
  • Título da revisão: <section>
  • ID da revisão: 987249
  • Criado:
  • Criador: dann
  • É a revisão atual? Sim
  • Comentar

Conteúdo da revisão

{{ HTMLVersionHeader(5) }}

Sumário

O elemento HTML section(<section>) representa uma seção generica de um documento, isto é um agrupamento temático de conteúdos, tipicamente com um título. Cada <section> deve ser identificada, tipicamente incluindo um título (elemento h1-h6) como um filho do elemento <section>.
 

Notas de uso:

  • Se faz sentindo separar a ordem do conteúdo com um elemento {{HTMLElement("section")}}, use um elemento {{HTMLElement("article")}} em seu lugar.
     
  • Não use o elemento {{HTMLElement("section")}} como um container genérico, para isso que {{HTMLElement("div")}} serve, especialmente quando a seção é apenas com o propósito de estilização. Uma regra de ouro é quando um seção deve aparecer logicamente em um documento.
     

contexto de uso

Permitted content: Flow content
Tag omission: tanto a tag de início quanto a tag de fechamento são obrigatórias
Permitted parent elements

Any element that accepts flow content. Note that a {{HTMLElement("section")}} element must not be a descendant of an {{HTMLElement("address")}} element.

Normative document HTML5, section 4.4.2

Atributos

This element only includes the global attributes.

DOM Interface

This element implements the HTMLElement interface.

Exemplos

<section>
  <h1>Heading</h1>
  <p>Bunch of awesome content</p>
</section>

Compatibilidade

{{ CompatibilityTable() }}

Feature Chrome Firefox (Gecko) Internet Explorer Opera Safari
Basic support 5 {{ CompatGeckoDesktop("2.0") }} 9.0 11.10 4.1
Feature Android Firefox Mobile (Gecko) IE Mobile Opera Mobile Safari Mobile
Basic support 2.2 {{ CompatGeckoMobile("2.0") }} 9.0 11.0 5.0 (iOS 4.2)

veja também

  • Other section-related elements: {{ HTMLElement("body") }}, {{ HTMLElement("nav") }}, {{ HTMLElement("article") }}, {{ HTMLElement("aside") }}, {{ HTMLElement("h1") }}, {{ HTMLElement("h2") }}, {{ HTMLElement("h3") }}, {{ HTMLElement("h4") }}, {{ HTMLElement("h5") }}, {{ HTMLElement("h6") }}, {{ HTMLElement("hgroup") }}, {{ HTMLElement("header") }}, {{ HTMLElement("footer") }}, {{ HTMLElement("address") }};
  • Sections and outlines of an HTML5 document.

Fonte da revisão

<p>{{ HTMLVersionHeader(5) }}</p>

<h2 id="Sumário">Sumário</h2>

<p>O elemento HTML section(&lt;section&gt;) representa uma seção generica de um documento, isto é um agrupamento temático de conteúdos, tipicamente com um título. Cada&nbsp;&lt;section&gt; deve ser identificada, tipicamente incluindo um título&nbsp;(elemento&nbsp;<code><a href="https://www.w3.org/html/wg/drafts/html/master/sections.html#the-h1,-h2,-h3,-h4,-h5,-and-h6-elements">h1</a></code>-<code><a href="https://www.w3.org/html/wg/drafts/html/master/sections.html#the-h1,-h2,-h3,-h4,-h5,-and-h6-elements">h6</a>) </code>como um filho do elemento &lt;section&gt;.<br />
 &nbsp;</p>

<div class="note">
<p><em>Notas de uso:</em></p>

<ul>
 <li>Se faz&nbsp;sentindo separar a ordem do conteúdo com um elemento {{HTMLElement("section")}}, use um elemento&nbsp;{{HTMLElement("article")}} em seu lugar.<br />
  &nbsp;</li>
 <li>Não use o elemento&nbsp;{{HTMLElement("section")}} como um container genérico, para isso que&nbsp;{{HTMLElement("div")}} serve, especialmente quando a seção é apenas com o propósito de estilização. Uma regra de ouro é quando um seção deve aparecer logicamente em um documento.<br />
  &nbsp;</li>
</ul>
</div>

<h2 id="contexto_de_uso"><span class="short_text" id="result_box" lang="pt"><span class="hps">contexto de uso</span></span></h2>

<table class="standard-table">
 <tbody>
  <tr>
   <td><dfn>Permitted content</dfn>:</td>
   <td><a href="/en/HTML/Content_categories#Flow_content" title="en/HTML/Content Categories#Flow content">Flow content</a></td>
  </tr>
  <tr>
   <td><dfn>Tag omission:</dfn></td>
   <td><span class="short_text" id="result_box" lang="pt"><span class="hps">tanto a</span> <span class="alt-edited hps">tag de início</span> <span class="hps">quanto a</span> <span class="alt-edited hps">tag de fechamento</span> <span class="alt-edited hps">são obrigatórias</span></span></td>
  </tr>
  <tr>
   <td><span class="short_text" id="result_box" lang="pt"><dfn>Permitted parent elements</dfn></span></td>
   <td>
    <p>Any element that accepts <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Content_categories#Flow_content">flow content</a>. Note that a {{HTMLElement("section")}} element must not be a descendant of an {{HTMLElement("address")}} element.</p>
   </td>
  </tr>
  <tr>
   <td>Normative document</td>
   <td><a class="external" href="https://www.whatwg.org/specs/web-apps/current-work/multipage/sections.html#the-section-element" rel="external nofollow" target="_blank" title="https://www.whatwg.org/specs/web-apps/current-work/multipage/sections.html#the-section-element">HTML5, section 4.4.2</a></td>
  </tr>
 </tbody>
</table>

<h2 id="Atributos"><span class="short_text" id="result_box" lang="pt"><span class="hps">Atributos</span></span></h2>

<p>This element only includes the <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes">global attributes</a>.</p>

<h2 id="DOM_Interface">DOM Interface</h2>

<p>This element implements the <code><a href="/en/DOM/element" title="en/DOM/element">HTMLElement</a></code> interface.</p>

<h2 id="Exemplos">Exemplos</h2>

<pre class="brush: html">
&lt;section&gt;
  &lt;h1&gt;Heading&lt;/h1&gt;
  &lt;p&gt;Bunch of awesome content&lt;/p&gt;
&lt;/section&gt;
</pre>

<h2 id="Compatibilidade">Compatibilidade</h2>

<p>{{ CompatibilityTable() }}</p>

<div id="compat-desktop">
<table class="compat-table">
 <tbody>
  <tr>
   <th>Feature</th>
   <th>Chrome</th>
   <th>Firefox (Gecko)</th>
   <th>Internet Explorer</th>
   <th>Opera</th>
   <th>Safari</th>
  </tr>
  <tr>
   <td>Basic support</td>
   <td>5</td>
   <td>{{ CompatGeckoDesktop("2.0") }}</td>
   <td>9.0</td>
   <td>11.10</td>
   <td>4.1</td>
  </tr>
 </tbody>
</table>
</div>

<div id="compat-mobile">
<table class="compat-table">
 <tbody>
  <tr>
   <th>Feature</th>
   <th>Android</th>
   <th>Firefox Mobile (Gecko)</th>
   <th>IE Mobile</th>
   <th>Opera Mobile</th>
   <th>Safari Mobile</th>
  </tr>
  <tr>
   <td>Basic support</td>
   <td>2.2</td>
   <td>{{ CompatGeckoMobile("2.0") }}</td>
   <td>9.0</td>
   <td>11.0</td>
   <td>5.0 (iOS 4.2)</td>
  </tr>
 </tbody>
</table>
</div>

<h2 id="veja_também"><span class="short_text" id="result_box" lang="pt"><span class="hps">veja também</span></span></h2>

<ul>
 <li><span class="short_text" id="result_box" lang="pt">Other section-related elements</span>: {{ HTMLElement("body") }}, {{ HTMLElement("nav") }}, {{ HTMLElement("article") }}, {{ HTMLElement("aside") }}, {{ HTMLElement("h1") }}, {{ HTMLElement("h2") }}, {{ HTMLElement("h3") }}, {{ HTMLElement("h4") }}, {{ HTMLElement("h5") }}, {{ HTMLElement("h6") }}, {{ HTMLElement("hgroup") }}, {{ HTMLElement("header") }}, {{ HTMLElement("footer") }}, {{ HTMLElement("address") }};</li>
 <li class="last"><a class="deki-ns current" href="/en/Sections_and_Outlines_of_an_HTML5_document" title="en/Sections and Outlines of an HTML5 document">Sections and outlines of an HTML5 document</a>.</li>
</ul>
Reverter para esta revisão