html - listas

MICROCAMP AMERICANA – WEB DEVELOPER – HTML / CSS

HTMLHTML

MICROCAMP AMERICANA – WEB DEVELOPER – HTML / CSS

ListasListas

• Listas ordenadas• Listas desordenadas

MICROCAMP AMERICANA – WEB DEVELOPER – HTML / CSS

Listas OrdenadasListas Ordenadas

• Uma lista ordenada consiste em criar uma lista com numeração.

• A tag para criar uma lista ordenada é a tag ol(ordened list).

• Cada item da lista deve ter o comando li (listitem):

<ol><li> Primeiro item da lista </li><li> Segundo item da lista </li>

</ol>

MICROCAMP AMERICANA – WEB DEVELOPER – HTML / CSS

Listas OrdenadasListas Ordenadas

• O comando ol tem os seguintes parâmetros:

• Start � escolher em que posição sua lista ira iniciar

• Type � escolher o tipo de numerador pra lista entre: 1 / i / I / a / A

<ol start=“3” type=“a”><li> Primeiro item da lista </li><li> Segundo item da lista </li>

</ol>

MICROCAMP AMERICANA – WEB DEVELOPER – HTML / CSS

Listas DesordenadasListas Desordenadas

• Uma lista desordenada consiste em criar uma lista com marcadores.

• A tag para criar uma lista ordenada é a tag ul(unordened list).

• Cada item da lista deve ter o comando li (listitem):

<ul><li> Primeiro item da lista </li><li> Segundo item da lista </li>

</ul>

MICROCAMP AMERICANA – WEB DEVELOPER – HTML / CSS

Listas DesordenadasListas Desordenadas

• O comando ul tem os seguintes parâmetros:

• Type � escolher o tipo de marcador pra lista entre: square / circle / disc

<ul type=“square”><li> Primeiro item da lista </li><li> Segundo item da lista </li>

</ul>

MICROCAMP AMERICANA – WEB DEVELOPER – HTML / CSS

ExercExercíícioscios

Construa uma página da web onde serão desenvolvidos os exercícios abaixo.1) Insira uma foto de um estádio como plano de fundo.2) Insira o brasão de 5 times de futebol.3) Crie uma lista ordenada com o nome dos 4 primeiros clubes do campeonato brasileiro.4) Crie uma lista ordenada com o nome dos 4 últimos clubes do campeonato brasileiro.5) Crie uma lista desordenada com os candidatos a prefeito de Americana.