Listas

Aprenda criar listas na sua pagina da web, utilizando Html…

HTML aceita listas que podem ser numeradas, não numeradas e de definição, sendo possível, inclusive, incluir sub-itens nas listas. Podemos usar as tags <ul> fechadas com </ul> para iniciar listas não numeradas, marcadas apenas com pontos gráficos. Por exemplo,

<h3>Lista não numerada</h3>
<ul>
<li> Primeiro item
<li> Segundo item
<li> Terceiro item
</ul>produzirá:
Lista não numerada
Primeiro item
Segundo item
Terceiro item
Essa tag também pode ser usada para criar sub-itens na lista:

<h3>Lista não numerada com sub-itens</h3>
<ul>
<li> Primeiro item
<li> Segundo item
<ul>
<li> Primeiro sub-item
<li> Segundo sub-item
<ul>
<li> Primeiro item de sub-item
<li> Segundo item de sub-item
</ul></ul>
<li> Terceiro item
</ul>
Eis o resultado:

Lista não numerada com sub-itens
Primeiro item
Segundo item
Primeiro sub-item
Segundo sub-item
Primeiro item de sub-item
Segundo item de sub-item
Terceiro item
Quando desejamos tabular um parágrafo à direita, podemos usar uma lista de definição. Nas listas de definição, podemos usar as seguintes tags: <dl> para iniciar e </dl> para fechar a lista; <dt> para abrir e </dt> para fechar um título; e <dd> para iniciar e </dd> para encerrar um texto. Obs. Essas tags devem ser usadas em conjunto:

<dl>
<dt>Esse é um título da lista</dt>
<dd>Eis aqui um primeiro texto</dd>
<dt>Eis outro Título</dt>
<dd>Novo texto para a lista</dd>
</dl>

resultado:

Esse é um título da lista
Eis aqui um primeiro texto
Eis outro Título
Novo texto para a lista
Se quisermos uma lista numerada, usamos: <ol> </ol>

<h3>Lista numerada</h3>
<ol>
<li> Primeiro item da Lista
<li> Segundo item da Lista
<li> Terceiro item da Lista
</ol>

resultado:

Lista numerada
Primeiro item da Lista
Segundo item da Lista
Terceiro item da Lista
Bem… podemos fazer uma salada de listas:

<h1>Salada de listas</h1>
<DL>
<DT>Primeiro item da lista
<DD>Primeiro item da lista de definição
<UL>
<LI>Primeiro item não numerado desta lista
<OL>
<LI>Primeiro sub-item numerado desta lista
<LI>Segundo sub-item numerado desta lista
<UL>
<LI>Primeiro item não numerado do sub-item numerado
<LI>Segundo item não numerado do sub-item numerado
</UL>
<LI>Terceiro sub-item numerado desta lista
</OL>
<LI>Segundo item não numerado desta lista
<LI>Terceiro item não numerado desta lista
</UL>
<DT>Segundo Item da Lista
<DD>Segundo item da Lista de Definição
<OL>
<LI>Primeiro item numerado desta lista
<LI>Segundo item numerado desta lista
</OL>
<DT>Terceiro Item da Lista
</OL>
</DL>

Eis a saída:

Salada de listas
Primeiro item da lista
Primeiro item da lista de definição
Primeiro item não numerado desta lista
Primeiro sub-item numerado desta lista
Segundo sub-item numerado desta lista
Primeiro item não numerado do sub-item numerado
Segundo item não numerado do sub-item numerado
Terceiro sub-item numerado desta lista
Segundo item não numerado desta lista
Terceiro item não numerado desta lista
Segundo Item da Lista
Segundo item da Lista de Definição
Primeiro item numerado desta lista
Segundo item numerado desta lista
Terceiro Item da Lista