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 678323 of <section>

  • Slug da revisão: Web/HTML/Element/section
  • Título da revisão: <section>
  • ID da revisão: 678323
  • Criado:
  • Criador: leosilva-rs
  • É a revisão atual? Não
  • Comentar

Conteúdo da revisão

{{ HTMLVersionHeader(5) }}

Sumário

Elemento HTML Section (<section>)representa uma seção de um documento genérico i.e., um agrupamento temático de conteúdo, geralmente com um título.
Cada <section> É normalmente identificada, incluindo um título (elemento h1-h6) como um filho do elemento <section>.

Usage notes :

  • Se faz sentido separadamente distribuir o conteúdo de um {{ Elemento HTML("section") }} use o elemento ,{{ Elemento HTML ("article") }} em seu lugar.
  • Não use o {{ Elemento HTML("section") }} como um contêiner genérico; isso é para o {{ Elemento HTML("div") }} , principalmente quando o bloco é apenas para fins de estilo. A regra de ouro é que uma seção deve aparecer logicamente no contorno de 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

Qualquer elemento que aceita o fluxo de conteúdo. Note-se que um {{ Elemento HTML("section") }}não deve ser um descendente de um {{Elemento HTML("address") }} .

Normative document HTML5, section 4.4.2

Atributos

This element has no attributes other than the global attributes, common to all elements.

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

  • Outros elementos relacionados a section: {{ 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.C3.A1rio">Sumário</h2>
<p>O&nbsp;<em> <em>Elemento HTML </em>Section </em>(<code>&lt;section&gt;</code>)<span class="short_text" id="result_box" lang="pt"><span class="hps alt-edited">representa uma seção</span> <span class="hps">de</span> <span class="hps">um</span> <span class="hps">documento</span> <span class="hps">genérico</span></span> i.e., <span id="result_box" lang="pt"><span class="hps">um agrupamento</span> <span class="hps">temático</span> <span class="hps">de</span> <span class="hps">conteúdo,</span> <span class="hps">geralmente</span> <span class="hps">com um título.</span></span><br />
 <span lang="pt"><span class="hps">Cada &lt;section&gt; É normalmente identificada, incluindo um título (elemento h1-h6) como um filho do elemento &lt;section&gt;.</span></span></p>
<div class="note">
 <p><em>Usage notes :</em></p>
 <ul>
  <li><span id="result_box" lang="pt"><span class="hps">Se</span> <span class="hps">faz sentido</span> <span class="hps">separadamente</span> <span class="hps alt-edited">distribuir</span> <span class="hps">o conteúdo de um</span></span> {{ Elemento HTML("section") }} use o elemento ,{{ Elemento HTML ("article") }} <span id="result_box" lang="pt"><span class="hps">em seu lugar.</span></span></li>
  <li><span id="result_box" lang="pt"><span class="hps">Não use o </span></span>{{ Elemento HTML("section") }} <span id="result_box" lang="pt"><span class="hps">como um</span> <span class="hps">contêiner genérico</span></span>; isso é para o {{ Elemento HTML("div") }} , <span id="result_box" lang="pt"><span>principalmente quando o bloco</span><span class="hps"> é</span> <span class="hps">apenas para fins</span> <span class="hps">de estilo.</span></span> A<span id="result_box" lang="pt"> <span class="hps">regra de ouro é</span> <span class="hps">que uma seção</span> <span class="hps">deve aparecer</span> <span class="hps">logicamente</span> <span class="hps">no contorno</span> <span class="hps">de um documento.</span></span></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="hps alt-edited">tag de início</span> <span class="hps">quanto a</span> <span class="hps alt-edited">tag de fechamento</span> <span class="hps alt-edited">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><span id="result_box" lang="pt"><span class="hps">Qualquer</span> <span class="hps">elemento</span> <span class="hps">que aceita</span> <span class="hps">o fluxo</span> <span class="hps">de conteúdo.</span> <span class="hps">Note-se que</span> <span class="hps">um</span></span> {{ Elemento HTML("section") }}<span class="short_text" id="result_box" lang="pt"><span class="hps">não deve</span> <span class="hps">ser um descendente de</span> <span class="hps">um</span></span> {{Elemento HTML("address") }} .</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 has no attributes other than the <a href="/en/HTML/Global_attributes" rel="internal">global attributes</a>, common to all elements.</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.C3.A9m"><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"><span class="hps">Outros</span> <span class="hps">elementos</span> <span class="hps">relacionados</span> <span class="hps alt-edited">a section</span></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