Revision 327815 of article (artigo)

  • Revision slug: HTML/Element/article
  • Revision title: article (artigo)
  • Revision id: 327815
  • Created:
  • Creator: robsonds
  • Is current revision? No
  • Comment

Revision Content

{{ HTMLVersionHeader(5) }}

Resumo

O Elemento HTML Article (<article>) representa uma composição independente em um documento, página, aplicação, ou site, ou que é destinado á ser distribuido de forma independente ou reutilizável, por exemplo, em sindicação. Este poderia ser o post de um fórum, um artigo de revista ou jornal, um post de um blog, um comentário enviado por um usuário, um gadget ou widget interativos, ou qualquer outra forma de conteúdo independente.

Notas de uso:

  • Quando um elemento <article> está aninhado, o elemento interior representa um artigo relacionado com o elemento exterior. Por exemplo, os comentários do post de um blog podem ser elementos <article> aninhados em <article> representando o post do blog.
  • Informações sobre o autor de um elemento <article> podem ser fornecidas através do elemento {{ HTMLElement("address") }} ,mas ele não se aplica aos elementos <article> aninhados.
  • A data e hora de publicação de um elemento <article> pode ser descrita usando o atributo {{ htmlattrxref("pubdate", "time") }} de um elemento {{ HTMLElement("time") }}.

Contexto de uso

Conteúdo permitido Flow content
Omissão de tag Nenhuma, tanto tag de início quanto de fim são obrigatórias
Elementos pai permitidos

Qualquer elemento que aceita flow content. Note-se que um elemento <article> não pode ser descendente de um elemento {{ HTMLElement("address") }}.

Documento normativo HTML5, section 4.4.4

Atributos

Este elemento não possui outros elementos se não os global attributes, comuns a todos os elementos.

Interface DOM

Este elemento implementa a interface HTMLElement .

Exemplos

<article>
  <h4>Um artigo realmente impressionante</h4>
  <p>Lotes de texto incrível.</p>
</article>

Resultado

<article>

Um artigo realmente impressionante

Lotes de texto incrível.

</article>

Compatibilidade

{{ CompatibilityTable() }}

Característica Chrome Firefox (Gecko) Internet Explorer Opera Safari
Suporte Básico 5 {{ CompatGeckoDesktop("2.0") }} 9.0 11.10 4.1
Característica Android Firefox Mobile (Gecko) IE Mobile Opera Mobile Safari Mobile
Suporte Básico 2.2 {{ CompatGeckoMobile("2.0") }} 9.0 11.0 5.0 (iOS 4.2)

Veja também

  • Outros elementos de seção relacionados: {{ HTMLElement("body") }}, {{ HTMLElement("nav") }}, {{ HTMLElement("section") }}, {{ 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.

Revision Source

<p>{{ HTMLVersionHeader(5) }}</p>
<h2 id="Summary">Resumo</h2>
<p>O <em>Elemento HTML Article</em> (<span style="font-family: Courier New;">&lt;article&gt;</span>) representa uma composição independente em um documento, página, aplicação, ou site, ou que é destinado á ser distribuido de forma independente ou reutilizável, por exemplo, em sindicação. Este poderia ser o post de um fórum, um artigo de revista ou jornal, um post de um blog, um comentário enviado por um usuário, um gadget ou widget interativos, ou qualquer outra forma de conteúdo independente.</p>
<div class="note">
  <p><em>Notas de uso:</em></p>
  <ul>
    <li>Quando um elemento <code>&lt;article&gt;</code> está aninhado, o elemento interior representa um artigo relacionado com o elemento exterior. Por exemplo, os comentários do post de um blog podem ser elementos <code>&lt;article&gt;</code> aninhados em <code>&lt;article&gt;</code> representando o post do blog.</li>
    <li>Informações sobre o autor de um elemento <code>&lt;article&gt;</code> podem ser fornecidas através do elemento {{ HTMLElement("address") }} ,mas ele não se aplica aos elementos <code>&lt;article&gt;</code> aninhados.</li>
    <li>A data e hora de publicação de um elemento <code>&lt;article&gt;</code> pode ser descrita usando o atributo {{ htmlattrxref("pubdate", "time") }} de um elemento {{ HTMLElement("time") }}.</li>
  </ul>
</div>
<h2 id="Usage_context">Contexto de uso</h2>
<table class="fullwidth-table" style="width: 1125px; height: 117px;">
  <tbody>
    <tr>
      <td>Conteúdo permitido</td>
      <td><a href="/en/HTML/Content_categories#Flow content" title="en/HTML/Content categories#Flow content">Flow content</a></td>
    </tr>
    <tr>
      <td>Omissão de tag</td>
      <td>Nenhuma, tanto tag de início quanto de fim são obrigatórias</td>
    </tr>
    <tr>
      <td>Elementos pai permitidos</td>
      <td>
        <p>Qualquer elemento que aceita <a href="/en/HTML/Content_categories#flow_content" title="https://developer.mozilla.org/en/HTML/Content_categories#flow_content">flow content</a>. Note-se que um elemento <code>&lt;article&gt;</code> não pode ser descendente de um elemento {{ HTMLElement("address") }}.</p>
      </td>
    </tr>
    <tr>
      <td>Documento normativo</td>
      <td><a class="external" href="http://www.whatwg.org/specs/web-apps/current-work/multipage/sections.html#the-article-element" rel="external nofollow" target="_blank" title="http://www.whatwg.org/specs/web-apps/current-work/multipage/sections.html#the-article-element">HTML5, section 4.4.4</a></td>
    </tr>
  </tbody>
</table>
<h2 id="Attributes">Atributos</h2>
<p>Este elemento não possui outros elementos se não os <a href="/en/HTML/Global_attributes" rel="internal">global attributes</a>, comuns a todos os elementos.</p>
<h2 id="DOM_Interface">Interface DOM</h2>
<p>Este elemento implementa a interface <code><a href="/en/DOM/element" title="en/DOM/element">HTMLElement</a></code> .</p>
<h2 id="Examples">Exemplos</h2>
<pre class="brush: html">
&lt;article&gt;
  &lt;h4&gt;Um artigo realmente impressionante&lt;/h4&gt;
  &lt;p&gt;Lotes de texto incrível.&lt;/p&gt;
&lt;/article&gt;
</pre>
<h3 id="Result">Resultado</h3>
<div style="background-color:#F6F6F2">
  &lt;article&gt;
  <h4 id="A_really_awesome_article">Um artigo realmente impressionante</h4>
  <p>Lotes de texto incrível.</p>
  &lt;/article&gt;</div>
<h3 id="Compatibility">Compatibilidade</h3>
<p>{{ CompatibilityTable() }}</p>
<div id="compat-desktop">
  <table class="compat-table">
    <tbody>
      <tr>
        <th>Característica</th>
        <th>Chrome</th>
        <th>Firefox (Gecko)</th>
        <th>Internet Explorer</th>
        <th>Opera</th>
        <th>Safari</th>
      </tr>
      <tr>
        <td>Suporte Básico</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>Característica</th>
        <th>Android</th>
        <th>Firefox Mobile (Gecko)</th>
        <th>IE Mobile</th>
        <th>Opera Mobile</th>
        <th>Safari Mobile</th>
      </tr>
      <tr>
        <td>Suporte Básico</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="See_also">Veja também</h2>
<ul>
  <li>Outros elementos de seção relacionados: {{ HTMLElement("body") }}, {{ HTMLElement("nav") }}, {{ HTMLElement("section") }}, {{ 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>
Revert to this revision