Trabalhando com Listas no HTML

 CRIANDO LISTAS COM HTML

A atividade de hoje vai se basear na criação de listas para o HTML.

EXPLICAÇÃO:

Não são raros os casos em que queremos exibir uma listagem em nossas páginas. O HTML tem algumas tags definidas para que possamos fazer isso de maneira correta. A lista mais comum é a lista não-ordenada definida pela tag <ul> (unordered list).

<ul>
  <li>Primeiro item da lista</li>
  <li>
    Segundo item da lista:
    <ul>
      <li>Primeiro item da lista aninhada</li>
      <li>Segundo item da lista aninhada</li>
    </ul>
  </li>
  <li>Terceiro item da lista</li>
</ul>

Note que, para cada item da lista não-ordenada, utilizamos uma marcação de item de lista <li> (list item). No exemplo acima, utilizamos uma estrutura composta na qual o segundo item da lista contém uma nova lista. A mesma tag de item de lista <li> é utilizada quando demarcamos uma lista ordenada.

<ol>
  <li>Primeiro item da lista</li>
  <li>Segundo item da lista</li>
  <li>Terceiro item da lista</li>
  <li>Quarto item da lista</li>
  <li>Quinto item da lista</li>
</ol>

As listas ordenadas (<ol> - ordered list) também podem ter sua estrutura composta por outras listas ordenadas como no exemplo que temos para as listas não-ordenadas. Também é possível ter listas ordenadas aninhadas em um item de uma lista não-ordenada e vice-versa.

Link da atividade:

Abra pelo celular

Clique abaixo para abrir em outra aba:

Clique aqui

Resultado Final da atividade