Você sabe o que eu amo? Listas.
Você já fez uma lista de tarefas ou de compras?
Já leu uma lista em uma página web como:
"As 10 caras de cachorros mais ridículas"?
Eu aposto que sim, porque o mundo está cheio de listas.
O HTML nos dá algumas 'tags' para fazermos listas,
e vamos praticar, fazendo
uma lista de razões pelas quais os coelhos são grandes animais de estimação.
Para começar uma lista com marcadores,
devemos começar com a tag "< ul >".
O que significa "< ul >" e o que ela faz?
Aposto que você pode adivinhar o que o "l" representa 'lista' (List).
O "u", é um pouco mais complicado, ele representa 'não ordenada' (Unordered),
isso significa que o navegador não numerará os itens da lista
Ele só vai adicionar pequenas marcações.
Para ver o que quero dizer, vamos adicionar o primeiro item,
"Eles são peludos". (They're Furry)
Viu o pequeno círculo no lado?
Isso é um marcador.
Agora, o que você acha que "< li >" significa?
O "l" é de lista, e o "i" é de item, ou seja, item da lista (List Item).
Sempre que quisermos adicionar um item
precisamos adicionar um novo "< li >" sob o "< ul >".
Cada "< ul >" deve ter pelo menos um "< li >" sob ela,
porque uma lista sem itens é muito chato.
Vamos adicionar um pouco mais,
"Grandes ouvintes" (Great listeners) e...,
"Come todas as suas sobras de cenouras" (Eat all your leftover carrots)
Esta deve ser uma lista bastante convincente.
Não sei quem não ia querer um coelho depois de ler isso.
Eu não numerei esta lista
porque eu não acho que uma das razões
seja mais importante do que a outra,
mas tem um monte de vezes que queremos fazer listas numeradas.
Como, se quiséssemos fazer uma
Uma lista com os "Os três coelhos mais famosos".
Para começar a nossa lista numerada,
vamos usar um "< ol >" em vez de um "< ul >".
Já descobriu o que significa "< ol >"?
Dica: é só cortar a primeira
letra do significado de "< ul >".
Isso mesmo, ele significa "lista ordenada" (Ordened List).
Ele diz que um navegador deve numerar
automaticamente cada novo item.
No entanto, ainda usamos "< li >" para adicionar novos itens
dentro da lista.
Vamos colocar Pernalonga(Bugs Bunny)
temos "Tambor" (Thumper),
e, claro, não podemos esquecer do "Coelhinho da Páscoa" (Easter Bunny).
O interessante das listas numeradas
é que o navegador toma conta da numeração por nós.
Então se reorganizarmos, excluir ou adicionar novos itens
ele sempre atualiza os números corretamente.
Aí você me diz
que não conhece "Tambor" (Thumper).
Em primeiro lugar, só vou dizer que você
deve assistir o filme "Bambi".
Mas, vou mover contra minha vontade
"Tambor"(Thumper) para a parte inferior.
Agora, o pobre "Tambor" (Thumper) é o número três.
Agora você tem tudo o que precisa para fazer listas.
Vá em frente e faça uma lista de tudo.
Traduzido por [ Fernando dos Reis] Revisado por [Valter Bigeli]