Apreenda agora como fazer uma lista no HTML!


Você que já está estudando HTML e já sabe como criar página na internet, vamos agora aprender agora como fazer listas em páginas da web!

Uma lista é um parágrafo estruturado que contém uma sequência de artigos. A linguagem HTML define três tipos de listas: a lista ordenada, a lista não ordenada e a lista de definições.



Se você ainda não está familiarizado com as tags HTML visite esse artigo aqui e depois volte para essa página!

As listas são importantes quando queremos listar itens no site e também para a criação de menu de navegação.

Nesse artigo vamos mostrar para você como você faz para criar uma lista ordenada, ou seja, que comece com a tag ol e seus respectivos itens da lista ficam dentro da tag li.

Também apresentaremos as listas desordenadas e listas por definição!

Por padrão as listas ordenadas são ordenadas por números, mas também iremos ver como ordena-la por outras formas.



Deverá aparecer assim no site:

  1. Nome
  2. Telefone
  3. Endereço
  4. País


Além desses dois tipos de ordenação, existem diversos tipos como Algarismos Romanos:



A imagem vai ficar assim:

  1. Nome
  2. Telefone
  3. Endereço
  4. País



Já as Listas Desordenadas são iniciadas com a tag ul e são representadas por pequenos bullets, vamos ao código:



No site vai aparecer assim:

  1. Nome
  2. Telefone
  3. Casa
  4. Estado



Apreenda agora como fazer uma lista no HTML!


As listas por definição são um pouco mais diferente, elas são representadas pela tag dl, seguido de dt e dd, ficando assim no código:



Na Exibição ficará assim:

  • Nome
  • Telefone
  • Casa
  • Estado


Aprendemos hoje a trabalhar com listas ordenadas, listas desordenadas e listas de definição. As listas desordenadas são muito usadas para a criação de menu de navegação.


Apreenda agora como fazer uma lista no HTML!


Aproveite e treine bastante para o seu próprio aprendizado, espero que tenha gostado do artigo. Por gentileza curta nossas redes sociais clicando nos botões logo abaixo:

Curta as nossas redes sociais: