Listas Ordenadas em HTML
O tópico de discussão é Listas HTML ordenadas. Uma lista ordenada é definida pela tag HTML <ol> . Existem dois tipos de listas ordenadas: numéricas e alfabéticas.
Listas HTML Ordenadas
Usando uma lista ordenada em HTML, os itens podem ser organizados em uma ordem específica, com números sequenciais atribuídos a cada item. Ao contrário de uma lista não ordenada, onde cada item é indicado por um marcador ou outro símbolo.
Para criar uma lista ordenada em HTML, a tag <ol> é usada para indicar o início da lista e a tag <li> é usada para identificar cada item da lista. Para gerar os números de cada item da lista, o navegador gera automaticamente os números começando com 1 e os incrementando a cada item subseqüente da lista.
O CSS permite que você personalize a aparência da lista ordenada de várias maneiras, como alterar o estilo de numeração, adicionar uma cor de fundo ou ajustar o espaçamento entre os itens da lista ordenada. Há muitas maneiras pelas quais as listas ordenadas são usadas no conteúdo da Web, como instruções passo a passo, as 10 principais listas e outros tipos de conteúdo de classificação.
Um número será atribuído a cada item na lista por padrão:
Example
Listas Html Ordenadas - O Atributo Type
O parâmetro de tipo da tag <ol> especifica o tipo de marcador de item da lista:
Tipo | Visão geral |
---|---|
tipo=”A” | Letras maiúsculas serão usadas para numerar os itens na lista |
tipo=”1″ | Os itens da lista são numerados (por padrão) |
tipo=”eu” | Os itens da lista serão numerados em algarismos romanos maiúsculos |
tipo=”a” | Os itens da lista serão numerados em letras minúsculas |
tipo=”i” | Algarismos romanos serão usados para numerar os itens da lista |
Numbers:
Lowercase Letters:
Uppercase Letters:
Lowercase Roman Numbers:
Uppercase Roman Numbers:
Contagem da lista de controle
Uma lista ordenada conta a partir de 1 por padrão. Você pode usar o atributo start se quiser começar a contar a partir de um número especificado , como:
Example
Listas HTML invertidas
O atributo invertido é um atributo booleano.
Especifica que a ordem da lista deve ser descendente (9,8,7…) em vez de ascendente (1, 2, 3…).
Example:
Outro exemplo de lista ordenada inversa usando a ordem alfabética:
Example:
Aqui está a lista combinada de todos os tipos de ol :
Example:
Listas HTML Ordenadas Aninhadas
Existe a capacidade de aninhar listas (lista dentro de uma lista dentro de uma lista) As listas HTML são ordenadas da seguinte forma:
Example
Observação: um item de lista ( <li> ) pode incluir elementos HTML adicionais, como links e fotos, bem como uma nova lista.
Listas HTML Ordenadas – Tags
Marcação | Visão geral |
---|---|
<dt> | Fornece a definição de um termo em uma lista de descrição. |
<ul> | Lista organizada em ordem em HTML Listas ordenadas |
<li> | Os itens da lista são definidos por esta propriedade |
<dl> | Uma lista de descrição é especificada |
<ol> | Listas que são ordenadas |
<dd> | Fornece uma lista de descrição para o termo |
Visite nossa referência de tags HTML para ver uma lista completa de todas as tags HTML.
Resumo do capítulo
- Representando uma lista ordenada usando o elemento <ol> do HTML
- Determinando o tipo de numeração com o atributo de tipo HTML
- Para descrever um item de lista, use o elemento HTML <li>
- Listas aninhadas são viáveis
- Elementos HTML podem ser incluídos em itens de lista