Tipos de listas em (X)HTML

A marcação (X)HTML utiliza três tipos de listas para apresentar uma lista de informações, são elas:

• Listas ordenadas;
• Listas não-ordenadas;
• Listas de definição.

Um exemplo básico da utilização das listas é em um mecanismo de navegação, uma barra de navegação ou um menu lateral. Infelizmente ainda encontramos sites na internet que não utilizam a marcação de listas para marcar o conteúdo de navegação do site.
Todas as listas devem conter mais do que um elemento.

Listas Ordenadas

Utilizada para marcar uma ordenação no conteúdo. Quando a informação tem uma seqüência a ser respeitada. Para iniciar a marcação utilizamos o elemento ol. Depois para marcamos os itens das listas, utilizamos o elemento li. As listas são renderizadas com uma marcação seqüencial antes do conteúdo da lista. Veja o exemplo:

<ol>
	<li>Rio Grande Do sul</li>
	<li>Minas Gerais</li>
	<li>Rio de Janeiro</li>
</ol>

Listas não-ordenadas.

O tipo de lista mais comum de se utilizar em sites são as listas não-ordenadas. Esse tipo de lista é utilizado quando a informação a ser mostrada não segue uma seqüência. Para iniciar uma lista não ordenada usamos o elemento ol. Para marcar os itens dessa lista usamos o mesmo elemento li. Veja o exemplo:

<ul>
<li>Criação de sites</li>
<li>Montagem e manutenção de computadores</li>
<li>Aulas particulares</li>
</ul>

Listas de definição

São poucos os desenvolvedores que utilizam as listas de definição. Essas listas são formadas por uma definição da lista e sua descrição. Para iniciar a lista utilizamos o elemento dl. Depois cada grupo de definição é marcado com dt. Para definir o termo da lista usamos o dd que devera estar contido dentro do elemento dt que por sua vez está dentro do elemento dl. Veja o exemplo.

<dl> 
	<dt>Curso de web Standards</dt> 
		<dd>Manhã/tarde/noite</dd> 
		<dd>20/12/2009</dd> 
	<dt>Curso de PHP</dt> 
		<dd>noite</dd> 
		<dd>22/12/2009</dd> 
</dl> 

Lista com vários níveis e não-ordenadas

<ul>
	<li>Países</li>
    	<ul>
        	<li>América do sul</li>
            	<ul>
                	<li>Brasil</li>
                    <li>Argentida</li>
                    <li>Paraguai</li>
                </ul>
            <li>América do norte</li>
            	<ul>
                	<li>Estados Unidos</li>
                    <li>Canadá</li>
                    <li>México</li>
                </ul>
		</ul>                
	<li>Cidades</li>
       	<ul>
        	<li>Curitiba</li>
            <li>Salvador</li>
            <li>Floarianópolis</li>
        </ul>
</ul>

Lista com vários níveis, não-ordenadas e ordenadas

As listas podem ser usadas em conjuntos em um documento, ou seja, simultaneamente, uma lista dentro da outra. Podemos também criar níveis. No exemplo que segue temos uma lista não-ordenada dentro de uma lista ordenada.

<ol>
	<li>Países</li>
    	<ul>
        	<li>América do sul</li>
            	<ul>
                	<li>Brasil</li>
                    <li>Argentina</li>
                    <li>Paraguai</li>
                </ul>
            <li>América do norte</li>
            	<ul>
                	<li>Estados Unidos</li>
                    <li>Canadá</li>
                    <li>México</li>
                </ul>
		</ul>                
	<li>Cidades</li>
       	<ul>
        	<li>Curitiba</li>
            <li>Salvador</li>
            <li>Floarianópolis</li>
        </ul>
</ol>

Veja os exemplos
Pessoal por hoje era isso! Uma ótima semana para todos. Fiquem com Deus.