dl
Baseline
Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since julho de 2015.
Resumo
O elemento HTML Definition List (<dl>) 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).
Contexto de Uso
| Conteúdo permitido | Zero ou mais elementos <dt>, cada um seguido de um ou mais elementos <dd> |
|---|---|
| Omissão de Tag | Nenhum, este é um elemento vazio. |
| Permite elementos pai | Qualquer elemento que aceite conteúdo de fluxo. |
| Documentação normativa | HTML5, section 4.5.8; HTML 4.01, section 10.3 |
Atributos
Como todo elemento HTML, ele fornece os attributos globais.
compactNão padrão-
Obriga a definição da descrição aparecer na mesma linha que a definição do termo. Funciona apenas no Internet Explorer.
Exemplos
Termo e definição única
<dl>
<dt>Firefox</dt>
<dd>
A free, open source, cross-platform, graphical web browser developed by the
Mozilla Corporation and hundreds of volunteers.
</dd>
<!-- other terms and definitions -->
</dl>
Output:
Múltiplos termos, definição única
<dl>
<dt>Firefox</dt>
<dt>Mozilla Firefox</dt>
<dt>Fx</dt>
<dd>
A free, open source, cross-platform, graphical web browser developed by the
Mozilla Corporation and hundreds of volunteers.
</dd>
<!-- other terms and definitions -->
</dl>
Saída:
Termo único, múltiplas definições
<dl>
<dt>Firefox</dt>
<dd>
A free, open source, cross-platform, graphical web browser developed by the
Mozilla Corporation and hundreds of volunteers.
</dd>
<dd>
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).
</dd>
<!-- other terms and definitions -->
</dl>
Saída:
Múltiplos termos e definições
Também é possível definir vários termos com as definições múltiplas correspondentes, combinando com os exemplos acima.
Interface DOM
Notas
Não use este elemento, (nor <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.
Para mudar a indentação de um termo, use a propriedade CSS margin.
Compatibilidade de navegadores
Loading…