Terminamos o assunto das listas estudando as listas de definição. Veremos também a combinação de listas.
Listas de definição
Cada elemento é apresentado junto com sua definição. A definição principal é <dl> e </dl> (definition list). As etiquetas do elemento e sua definição são <dt> (difinition term) e <dd> (definition definition) respectivamente.
Aqui lhe propomos um código que poderá clarear este sistema:
<p>Dicionário da Língua Portuguesa</p>
<dl>
<dt>Açougue</dt>
<dd>Estabelecimento onde se vendem carnes frescas</dd>
<dt>Colheita</dt>
<dd>Ato de colher os produtos agrícolas</dd>
</dl>
O efeito produzido:
Dicionário da Língua Portuguesa
- Açougue
- Estabelecimento onde se vendem carnes frescas
- Colheita
- Ato de colher os produtos agrícolas
Observe que em cada linha <dd> está deslocada da direção da esquerda. Este tipo de etiquetas é usado muitas vezes com o propósito de criar textos mais ou menos deslocados da direção da esquerda.
O código:
<dl>
<dd>Primeiro nível de deslocamento
<dl>
<dd>Segundo nível de deslocamento
<dl>
<dd>Terceiro nível de deslocamento
</dl>
</dl>
</dl>
O resultado:
- Primeiro nível de deslocamento
- Segundo nível de deslocamento
- Terceiro nível de deslocamento
Combinando listas
Nada nos impede de utilizar todas estas etiquetas de forma combinada como vimos em outros casos. Dessa forma, podemos conseguir listas mistas como, por exemplo:
<p>Cidades do mundo</p>
<ul>
<li>Brasil
<ol>
<li>Rio de Janeiro
<li>Salvador
</ol>
<li>Espanha
<ol>
<li>Madrid
<li>Barcelona
</ol>
</ul>
Dessa forma criamos uma lista como esta:
Cidades do mundo
- Brasil
- Rio de Janeiro
- Salvador
- Espanha
- Madrid
- Barcelona
Comentários do artigo