LMMD-MUS LMMD-MUS LMMD-MUS

home HOME

HTML Básico
HTML INÍCIO
HTML & WWW
HTML Introdução
HTML Elementos
HTML Tags Básicas
HTML Formatação
HTML Entidades
HTML Links
HTML Frames
HTML Tabelas
HTML Listas
HTML Formulários
HTML Imagens
HTML Background

HTML Avançado
HTML Layout
HTML Fontes
HTML Porque 4.0?
HTML Estilos
HTML Head
HTML Meta
HTML URLs
HTML Scripts
HTML Webserver

Listas em HTML

Anterior Próxima

A HTML suporta listas ordenadas, não ordenadas e de definições.


Exemplos

Uma lista não ordenada
Este exemplo demonstra uma lçista não ordenada.

Uma lista ordenada
Este exemplo demonstra uma lista ordenada.

(Você pode encontrar mais exemplos no final desta página.)


Listas Não Ordenadas

Uma lista não ordenada é uma lista de itens. As listas de itens são marcadas com bullets (tipicamente pequenos círculos pretos).

Uma lista não ordenada começa com a tag <ul>. Cada item da lista começa com a tag <li>.

<ul>
<li>Café</li>
<li>Leite</li>
</ul>

Aqui está como aparece em um navegador:

  • Café
  • Leite

Dentro de um item de uma lista você pode colocar parágrafos, quebras de linha, imagens, vínculos, outras listas, etc.


Listas ordenadas

Uma lista ordenada é também uma lista de itens. As listas de itens são marcadas com números.

Uma lista ordenada começa com a tag <ol>. Cada item da lista começa com a tag <li>.

<ol>
<li>Café</li>
<li>Leite</li>
</ol>

Aqui está como aparece em um navagador:

  1. Café
  2. Leite

Dentro de um item de uma lista você pode colocar parágrafos, quebras de linha, imagens, vínculos, outras listas, etc.


Lista de Definições

Uma lista de definições não é uma lista de itens. Esta é uma lista de termos e explicações dos termos.

Uma lista de definições começa com a tag <dl>. Cada termo da lista de definições começa com a tag <dt>. Cada definição da lista de definições começa com a tag <dd>.

<dl>
<dt>Café</dt>
<dd>Bebida quente preta</dd>
<dt>Leite</dt>
<dd>Bebida fria branca</dd>
</dl>

Aqui está como aparece em um navegador:

Café
Bebida quente preta
Leite
Bebida fria branca

Dentro de uma definição de lista de definições você pode colocar parágrafo, quebras de linha, imagens, vínculos, outras listas, etc.


Mais Exemplos

Diferentes tipos de listas ordenadas
Este exemplo demonstra diferentes tipos de listas ordenadas.

Diferentes tipos de listas não ordenadas
Este exemplo demonstra diferentes tipos de listas não ordenadas.

Listas aninhadas
Este exemplo demonstra como você pode aninhar listas.

Listas aninhadas 2
Este exemplo demonstra uma lista aninhada mais complicada.

Lista de definições
Este exemplo demonstra uma lista de definições.


Tags de Listas

Tag Descrição
<ol> Define uma lista ordenada
<ul> Define uma lista não ordenada
<li> Define um item de lista
<dl> Define uma lista de definições
<dt>< Define um termo de definição
<dd> Define uma descrição de definição
<dir> Desaprovada. Use <ul> em vez
<menu> Desaprovada. Use <ul> em vez


Anterior Próxima