-
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]