diff options
Diffstat (limited to 'files/pt-br/web/html/element/main/index.html')
| -rw-r--r-- | files/pt-br/web/html/element/main/index.html | 152 |
1 files changed, 152 insertions, 0 deletions
diff --git a/files/pt-br/web/html/element/main/index.html b/files/pt-br/web/html/element/main/index.html new file mode 100644 index 0000000000..6a1e4b0042 --- /dev/null +++ b/files/pt-br/web/html/element/main/index.html @@ -0,0 +1,152 @@ +--- +title: <main> +slug: Web/HTML/Element/main +tags: + - Elemento + - HTML + - Referencia + - Web +translation_of: Web/HTML/Element/main +--- +<h2 id="Resumo">Resumo</h2> + +<p>O elemento <strong><code><main></code></strong><code> define o conteúdo principal dentro do </code>{{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<code> </code><span id="result_box" lang="pt"><span class="hps">(a não ser</span><span>, é claro,</span> caso <span class="hps">a função principal do</span> <span class="hps">documento</span> <span class="hps">seja</span><span class="hps"> fazer algum tipo de busca</span><span class="hps">).</span></span></p> + +<div class="note"> +<p><strong>Nota:</strong> <code><main></code> <strong>não pode </strong>ser filho dos elementos {{HTMLElement("article")}}, {{HTMLElement("aside")}}, {{HTMLElement("footer")}}, {{HTMLElement("header")}}, ou {{HTMLElement("nav")}}.</p> + +<p><span id="result_box" lang="pt"><span class="hps">Autores</span> <strong><span class="hps">não devem</span></strong> <span class="hps">incluir mais de um</span> <span class="hps">elemento main no mesmo </span><span class="hps">documento<strong>.</strong></span></span></p> +</div> + +<ul class="htmlelt"> + <li><dfn><a class="new" href="https://developer.mozilla.org/pt-BR/docs/HTML/Content_categories" title="HTML/Content_categories">Categorias de conteúdo</a></dfn><a href="/en-US/docs/Web/HTML/Content_categories#Flow_content" title="HTML/Content_categories#Flow_content">Conteúdo de fluxo</a>, conteúdo palpável.</li> + <li><dfn>Conteúdo permitido</dfn> <a href="/en-US/docs/Web/HTML/Content_categories#Flow_content" title="HTML/Content_categories#Flow_content">Conteúdo de fluxo</a>.</li> + <li><dfn>Omissão de tag</dfn> Nenhuma; <span id="result_box" lang="pt"><span class="hps">ambas</span> <span class="hps">as tags de início</span> <span class="hps">e fim</span> <span class="hps">são obrigatórios</span></span>.</li> + <li><dfn>Elementos pais permitidos</dfn> Qualquer elemento que aceite <a href="/en-US/docs/Web/HTML/Content_categories#Flow_content" title="HTML/Content_categories#Flow_content">conteúdo de fluxo</a>, mas não pode ser filho dos elementos {{HTMLElement("article")}}, {{HTMLElement("aside")}}, {{HTMLElement("footer")}}, {{HTMLElement("header")}}, ou {{HTMLElement("nav")}}.</li> + <li><dfn>DOM interface</dfn> {{domxref("HTMLElement")}}</li> +</ul> + +<h2 id="Atributos">Atributos</h2> + +<p><span style="line-height: 21px;">Este elemento admite apenas os </span><a href="/en-US/docs/Web/HTML/Global_attributes" style="line-height: 21px;" title="HTML/Global attributes">atributos globais</a><span style="line-height: 21px;">.</span></p> + +<h2 id="Exemplo">Exemplo</h2> + +<pre class="brush: html"><!-- 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 --></pre> + +<h2 id="Specifications" name="Specifications">Especificações</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">Especificação</th> + <th scope="col">Estado</th> + <th scope="col">Comentário</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('HTML WHATWG', '#the-main-element', '<main>')}}</td> + <td>{{Spec2('HTML WHATWG')}}</td> + <td><span id="result_box" lang="pt"><span class="hps">Removida</span> <span class="hps">a restrição</span> <span class="hps">sobre não usar</span> <span class="hps atn"><</span><span>main</span><span>></span> <span class="hps">como um filho</span> <span class="hps">dos elementos</span></span> {{HTMLElement("article")}}, {{HTMLElement("aside")}}, {{HTMLElement("footer")}}, {{HTMLElement("header")}}, ou {{HTMLElement("nav")}}.</td> + </tr> + <tr> + <td>{{SpecName('HTML5.1', 'grouping-content.html#the-main-element', '<main>')}}</td> + <td>{{Spec2('HTML5.1')}}</td> + <td>Não há mudança na {{SpecName('HTML5 W3C')}}</td> + </tr> + <tr> + <td>{{SpecName('HTML5 W3C', 'grouping-content.html#the-main-element', '<main>')}}</td> + <td>{{Spec2('HTML5 W3C')}}</td> + <td>Definição inicial.</td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility" name="Browser_compatibility">Navegadores compatíveis</h2> + +<p><span id="result_box" lang="pt"><span class="hps atn">O </span><span>elemento</span> <span class="hps atn"><</span><span>main</span><span>> </span></span><span lang="pt"><span class="hps">é amplamente suportado</span> <span class="hps">(exceto pelo</span> <span class="hps">Internet</span> <span class="hps">Explorer).</span> <span class="hps">Sugere-se</span> <span class="hps">que, até</span> que o elemento <span class="hps atn"><main</span><span>> seja</span><span class="hps"> suportado pelo</span> <span class="hps">Internet</span> <span class="hps">Explorer, adicione a ele o atributo role com o valor "main"</span></span>:</p> + +<pre class="brush: html"><main role="main"> + ... +</main> +</pre> + +<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 (WebKit)</th> + </tr> + <tr> + <td>Suporte básico</td> + <td>Chrome 26</td> + <td>{{ CompatGeckoDesktop("21.0") }}</td> + <td>{{CompatNo()}}</td> + <td>Opera 16</td> + <td>Safari 7</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 Phone</th> + <th>Opera Mobile</th> + <th>Safari Mobile</th> + </tr> + <tr> + <td>Suporte básico</td> + <td>{{CompatNo()}}</td> + <td>{{ CompatGeckoMobile("21.0") }}</td> + <td>{{CompatNo()}}</td> + <td>{{CompatNo()}}</td> + <td>{{CompatNo()}}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="Veja_também">Veja também</h2> + +<ul> + <li><span class="short_text" id="result_box" lang="pt"><span class="hps">Elementos estruturais básicos</span></span>: {{HTMLElement("html")}}, {{HTMLElement("head")}}, {{HTMLElement("body")}}</li> + <li>Elementos relacionados a seções: {{HTMLElement("article")}}, {{HTMLElement("aside")}}, {{HTMLElement("footer")}}, {{HTMLElement("header")}}, or {{HTMLElement("nav")}}</li> +</ul> + +<p> </p> |