helldanger1
GForum VIP
- Entrou
- Ago 1, 2007
- Mensagens
- 29,631
- Gostos Recebidos
- 1
Listas II
Estudamos um outro tipo de listas: as listas ordenadas.
Por Miguel Angel Alvarez - Tradução de JML
Continuamos estudando as listas do HTML, que nos possibilita criar estruturas atrativas para apresentar a informação.
Listas ordenadas
Neste caso, usaremos as etiquetas <ol> (ordered list) e seu fechamento. Cada elemento será igualmente precedido de sua etiqueta <li>.
Como exemplo:
<p>Regras de comportamento no trabalho</p>
<ol>
<li>O chefe sempre tem a razão</li>
<li>Em caso de dúvida, aplicar a regra 1</li>
</ol>
O resultado é:
Regras de comportamento no trabalho
O chefe sempre tem a razão
Em caso de dúvida aplicar a regra 1
Do mesmo modo das listas desordenadas, as listas ordenadas oferecem a possibilidade de modificar o estilo. Concretamente, nos é possível especificar o tipo de numeração empregado escolhendo entre números (1,2,3...), letras (a,b,c...) e suas maiúsculas (A,B,C...) e números romanos em suas versões maiúsculas (I,II,III...) e minúsculas (i,ii,iii...).
Para realizar tal seleção temos de utilizar, como para o caso anterior, o atributo type, o qual será situado dentro da etiqueta <ol>. Neste caso, os valores que o atributo pode tomar são:
1 Para ordenar por números
a Por letras do alfabeto
A Por letras maiúsculas do alfabeto
i Ordenação por números romanos em minúsculas
I Ordenação por números romanos em maiúsculas
Nota: Lembramos que em alguns navegadores não funciona a opção de mudar o tipo de marcador.
Pode ser que em algum caso desejemos começar nossa numeração por um número ou letra que não tem porque ser necessariamente o primeiro de todos. Para resolver esta situação, podemos utilizar um segundo atributo, start, que terá um número como valor. Este número, que por padrão é 1, corresponde ao valor a partir do qual começamos a definir nossa lista. Para o caso das letras ou dos números romanos, o navegador se encarrega de fazer a tradução do número à letra correspondente.
Propomos um exemplo usando este tipo de atributos:
<p>Ordenamos por números</p>
<ol type="1">
<li>Elemento 1</li>
<li>Elemento 2</li>
</ol>
<p>Ordenamos por letras</p>
<ol type="a">
<li>Elemento a</li>
<li>Elemento b</li>
</ol>
<p>Ordenamos por números romanos começando pelo 10</p>
<ol type="i" start="10">
<li> Elemento x</li>
<li> Elemento xi</li>
</ol>
O resultado:
Ordenamos por números
1. Elemento 1
2. Elemento 2
Ordenamos por letras
a. Elemento a
b. Elemento b
Ordenamos por números romanos começando pelo 10
x. Elemento x
xi. Elemento xi
Estudamos um outro tipo de listas: as listas ordenadas.
Por Miguel Angel Alvarez - Tradução de JML
Continuamos estudando as listas do HTML, que nos possibilita criar estruturas atrativas para apresentar a informação.
Listas ordenadas
Neste caso, usaremos as etiquetas <ol> (ordered list) e seu fechamento. Cada elemento será igualmente precedido de sua etiqueta <li>.
Como exemplo:
<p>Regras de comportamento no trabalho</p>
<ol>
<li>O chefe sempre tem a razão</li>
<li>Em caso de dúvida, aplicar a regra 1</li>
</ol>
O resultado é:
Regras de comportamento no trabalho
O chefe sempre tem a razão
Em caso de dúvida aplicar a regra 1
Do mesmo modo das listas desordenadas, as listas ordenadas oferecem a possibilidade de modificar o estilo. Concretamente, nos é possível especificar o tipo de numeração empregado escolhendo entre números (1,2,3...), letras (a,b,c...) e suas maiúsculas (A,B,C...) e números romanos em suas versões maiúsculas (I,II,III...) e minúsculas (i,ii,iii...).
Para realizar tal seleção temos de utilizar, como para o caso anterior, o atributo type, o qual será situado dentro da etiqueta <ol>. Neste caso, os valores que o atributo pode tomar são:
1 Para ordenar por números
a Por letras do alfabeto
A Por letras maiúsculas do alfabeto
i Ordenação por números romanos em minúsculas
I Ordenação por números romanos em maiúsculas
Nota: Lembramos que em alguns navegadores não funciona a opção de mudar o tipo de marcador.
Pode ser que em algum caso desejemos começar nossa numeração por um número ou letra que não tem porque ser necessariamente o primeiro de todos. Para resolver esta situação, podemos utilizar um segundo atributo, start, que terá um número como valor. Este número, que por padrão é 1, corresponde ao valor a partir do qual começamos a definir nossa lista. Para o caso das letras ou dos números romanos, o navegador se encarrega de fazer a tradução do número à letra correspondente.
Propomos um exemplo usando este tipo de atributos:
<p>Ordenamos por números</p>
<ol type="1">
<li>Elemento 1</li>
<li>Elemento 2</li>
</ol>
<p>Ordenamos por letras</p>
<ol type="a">
<li>Elemento a</li>
<li>Elemento b</li>
</ol>
<p>Ordenamos por números romanos começando pelo 10</p>
<ol type="i" start="10">
<li> Elemento x</li>
<li> Elemento xi</li>
</ol>
O resultado:
Ordenamos por números
1. Elemento 1
2. Elemento 2
Ordenamos por letras
a. Elemento a
b. Elemento b
Ordenamos por números romanos começando pelo 10
x. Elemento x
xi. Elemento xi
nos encontramos. Deste modo, a esquina superior esquerda corresponde à posição 0,0 e a esquina inferior direita corresponde às coordenadas X,Y. Se desejamos saber quais coordenadas correspondem a um ponto concreto de nossa imagem, o melhor é utilizar um programa de desenho gráfico como Photoshop ou Paint Shop Pro.