Listas ordenadas são muito utilizadas, nos tempos atuais ela é usada para substituir as tabelas, pois não se usa mais tabelas para exibir algo em linha, esta responsabilidade cabe às listas.
Existem listas ordenadas e não ordenadas, ambas são fácil de entender.
Vamos começar com lista ordenada, abaixo segue nosso código:
<ol>
<li>Mouse</li>
<li>Teclado</li>
<li>Caixa multimídia</li>
<li>Monitor</li>
<li>Estabilizador</li>
</ol>
Nosso resultado será:
Ele enumera cada item de nossa lista, onde:
- ol - (Ordered List) Lista ordenada
- li - Item de lista
Agora vamos ver as listas não ordenadas, ela é praticamente a mesma coisa que ordenada o que muda é que ao invés de usar <ol>, vamos usar <ul>.
Veja o código e sua utilização abaixo.
<ul>
<li>Processador</li>
<li>Memoria</li>
<li>HD</li>
<li>Cooler</li>
<li>Placa mãe</li>
</ul>
Podemos incluir novas sequências de listas dentro de outras listas, isso é muito comum na utilização de menus de navegação Dropdown.
<ul>
<li>Processador</li>
<li>Memoria</li>
<li>HD</li>
<li>Cooler</li>
<li>
<ul>
<li>Cabo Sata</li>
<li>Fonte de alimentação</li>
<li>Bateria</li>
<li>Cabo IDE</li>
</ul>
</li>
</ul>