---
title: summary
slug: Web/HTML/Element/summary
tags:
  - Element
  - HTML
  - Summary
  - Web
translation_of: Web/HTML/Element/summary
---
<h2 id="Sumário">Sumário</h2>

<p>O elemento HTML <em>summary</em> (<code>&lt;summary&gt;</code>) é utilizado como um sumário ou legenda para o conteúdo de um elemento {{ HTMLElement("details") }}.</p>

<div class="note"><strong>Nota:</strong> Se o elemento <code>&lt;summary&gt;</code> for omitido, o cabeçalho "details" será utilizado.</div>

<h2 id="Contexto_de_uso">Contexto de uso</h2>

<table class="standard-table">
 <tbody>
  <tr>
   <td>Conteúdo permitido</td>
   <td><a href="/en/HTML/Content_categories#Phrasing_content" title="en/HTML/Content categories#Phrasing content">Phrasing content</a></td>
  </tr>
  <tr>
   <td>Omissão de tag</td>
   <td>Nenhuma, tanto as tags iniciais quanto as finais devem estar presentes.</td>
  </tr>
  <tr>
   <td>Elementos pai permitidos</td>
   <td>O elemento {{ HTMLElement("details") }}.</td>
  </tr>
  <tr>
   <td>Documentos normativos</td>
   <td><a class="external" href="http://www.whatwg.org/specs/web-apps/current-work/multipage/interactive-elements.html#the-summary-element" rel="external nofollow">HTML5, section 4.11.2</a></td>
  </tr>
 </tbody>
</table>

<h2 id="Atributos">Atributos</h2>

<p>Como todos os outros elementos HTML, esse elemento possui os <a href="/pt-BR/docs/Web/HTML/Global_attributes">atributos globais</a>.</p>

<h2 id="Interface_do_DOM">Interface do DOM</h2>

<p>Esse elemento implementa a interface <code><a href="/en/DOM/element" title="en/DOM/element">HTMLElement</a></code>.</p>

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

<p>Veja a página {{ HTMLElement("details") }} para ver exemplos com <code>&lt;summary&gt;</code>.</p>

<h2 id="Browser_compatibility">Compatibilidade com navegadores</h2>

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

<div id="compat-desktop">
<table class="compat-table">
 <tbody>
  <tr>
   <th>Recurso</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>12</td>
   <td>{{CompatGeckoDesktop("49.0")}}<sup>[1]</sup></td>
   <td>{{ CompatNo() }}</td>
   <td>{{ CompatNo() }}</td>
   <td>{{ CompatNo() }}</td>
  </tr>
 </tbody>
</table>
</div>

<div id="compat-mobile">
<table class="compat-table">
 <tbody>
  <tr>
   <th>Recurso</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>4.0</td>
   <td>{{CompatGeckoMobile("49.0")}}<sup>[1]</sup></td>
   <td>{{ CompatNo() }}</td>
   <td>{{ CompatNo() }}</td>
   <td>{{ CompatNo() }}</td>
  </tr>
 </tbody>
</table>
</div>

<p>[1] Esse recurso está disponível desde o Firefox 47 prefereências <code>dom.details_element.enabled</code>,  iniciado por padrão como <code>false</code>,  exceto nas versões Nightly e Aurora ({{bug(1241750)}}). O suporte foi ativado, e a prferência foi alterada para <code>true</code>, desde o Firefox 49.0 ({{bug("1226455")}}).</p>

<h2 id="Veja_também">Veja também</h2>

<ul>
 <li>{{ HTMLElement("details") }}</li>
</ul>

<div class="noinclude">{{ languages({ "en": "en/HTML/Element/summary", "ja": "ja/HTML/Element/summary" }) }}</div>