---
title: dl
slug: Web/HTML/Element/dl
tags:
  - Elemento
  - HTML
  - Internet
  - Rede
  - Referencia
  - Web
translation_of: Web/HTML/Element/dl
---
<h2 id="Resumo">Resumo</h2>

<p>O elemento HTML <em>Definition List</em><span style="line-height: 21px;"> (</span><code style="color: rgb(51, 51, 51); font-size: 14px; line-height: 21px;">&lt;dl&gt;</code><span style="line-height: 21px;">)</span> engloba uma lista de pares de termos e descrições. Um uso comum para este elemento é para implementar um glossário ou exibir metadados(uma lista de pares chave e valor).</p>

<h2 id="Contexto_de_Uso">Contexto de Uso</h2>

<table class="standard-table">
 <tbody>
  <tr>
   <td>Conteúdo permitido</td>
   <td>Zero ou mais elementos {{ HTMLElement("dt") }}, cada um seguido de um ou mais elementos {{ HTMLElement("dd") }}</td>
  </tr>
  <tr>
   <td>Omissão de Tag</td>
   <td>Nenhum, este é um {{Glossary("elemento vazio")}}.</td>
  </tr>
  <tr>
   <td>Permite elementos pai</td>
   <td>Qualquer elemento que aceite <a href="/en/HTML/Content_categories#flow_content" title="en/HTML/Content categories#flow content">conteúdo de fluxo</a>.</td>
  </tr>
  <tr>
   <td>Documentação normativa</td>
   <td><a class="external" href="http://www.w3.org/TR/html5/grouping-content.html#the-dl-element">HTML5, section 4.5.8</a>; <a class="external" href="http://www.w3.org/TR/html401/struct/lists.html#h-10.3">HTML 4.01, section 10.3</a></td>
  </tr>
 </tbody>
</table>

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

<p>Como todo elemento HTML, ele fornece os <a href="/en/HTML/Global_attributes" title="en/HTML/Global attributes">attributos globais</a>.</p>

<dl>
 <dt>{{ htmlattrdef("compact") }} {{ Non-standard_inline() }}</dt>
 <dd>Obriga a definição da descrição aparecer na mesma linha que a definição do termo. Funciona apenas no Internet Explorer.</dd>
</dl>

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

<h3 id="Termo_e_definição_única">Termo e definição única</h3>

<pre class="brush: html">&lt;dl&gt;
  &lt;dt&gt;Firefox&lt;/dt&gt;
  &lt;dd&gt;A free, open source, cross-platform, graphical web browser
      developed by the Mozilla Corporation and hundreds of volunteers.&lt;/dd&gt;

  &lt;!-- other terms and definitions --&gt;
&lt;/dl&gt;
</pre>

<p>Output:</p>

<p><img alt="Image:HTML-dl1.png" class="internal" src="/@api/deki/files/241/=HTML-dl1.png"></p>

<h3 id="Múltiplos_termos_definição_única">Múltiplos termos, definição única</h3>

<pre class="brush: html">&lt;dl&gt;
  &lt;dt&gt;Firefox&lt;/dt&gt;
  &lt;dt&gt;Mozilla Firefox&lt;/dt&gt;
  &lt;dt&gt;Fx&lt;/dt&gt;
  &lt;dd&gt;A free, open source, cross-platform, graphical web browser
      developed by the Mozilla Corporation and hundreds of volunteers.&lt;/dd&gt;

  &lt;!-- other terms and definitions --&gt;
&lt;/dl&gt;
</pre>

<p>Saída:</p>

<p><img alt="Image:HTML-dl2.png" class="internal" src="/@api/deki/files/242/=HTML-dl2.png"></p>

<h3 id="Termo_único_múltiplas_definições">Termo único, múltiplas definições</h3>

<pre class="brush: html">&lt;dl&gt;
  &lt;dt&gt;Firefox&lt;/dt&gt;
  &lt;dd&gt;A free, open source, cross-platform, graphical web browser
      developed by the Mozilla Corporation and hundreds of volunteers.&lt;/dd&gt;
  &lt;dd&gt;The Red Panda also known as the Lesser Panda, Wah, Bear Cat or Firefox,
      is a mostly herbivorous mammal, slightly larger than a domestic cat
      (60 cm long).&lt;/dd&gt;

  &lt;!-- other terms and definitions --&gt;
&lt;/dl&gt;
</pre>

<p>Saída:</p>

<p><img alt="Image:HTML-dl3.png" class="internal" src="/@api/deki/files/243/=HTML-dl3.png"></p>

<h3 id="Múltiplos_termos_e_definições">Múltiplos termos e definições</h3>

<p>Também é possível definir vários termos com as definições múltiplas correspondentes, combinando com os exemplos acima.</p>

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

<ul>
 <li><a href="/en/DOM/HTMLDListElement" title="en/DOM/HTMLDListElement">HTMLDListElement</a></li>
</ul>

<h2 id="Notas">Notas</h2>

<p>Não use este elemento,  (nor {{ HTMLElement("ul") }} elements), para criar meramente um recuo em uma página. Embora ele funcione, está é uma má prática e obscurece o significado da lista de definição.</p>

<p>Para mudar a indentação de um termo, use a propriedade <a href="/en/CSS" title="en/CSS">CSS</a> <a href="/en/CSS/margin" title="en/CSS/margin">margin</a>.</p>

<h2 id="Browser_Compatibility" name="Browser_Compatibility">Compatibilidade de navegadores</h2>

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

<p>{{Compat("html.elements.dl")}}</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>Basic support</td>
   <td>1.0</td>
   <td>{{ CompatVersionUnknown() }}</td>
   <td>{{ CompatVersionUnknown() }}</td>
   <td>{{ CompatVersionUnknown() }}</td>
   <td>{{ CompatVersionUnknown() }}</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>Basic support</td>
   <td>{{ CompatVersionUnknown() }}</td>
   <td>{{ CompatVersionUnknown() }}</td>
   <td>{{ CompatVersionUnknown() }}</td>
   <td>{{ CompatVersionUnknown() }}</td>
   <td>{{ CompatVersionUnknown() }}</td>
  </tr>
 </tbody>
</table>
</div>

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

<ul>
 <li>Elemento {{ HTMLElement("dt") }}</li>
 <li>Elemento {{ HTMLElement("dd") }}</li>
</ul>

<div>{{HTMLRef}}</div>

<div> </div>

<div>{{languages({ "en": "en/HTML/Element/dl", "pl": "pl/HTML/Element/dl", "ja": "ja/HTML/Element/dl"})}}</div>