Para criar uma lista não numerada em html é muito simples.
A tag para inserção de uma lista é <ul>
e cada item da lista deve aparecer com a tag <li>.
Iremos partir logo para o exemplo, que assim fica fácil entender.
Para elaborar uma lista não numerada deve-se prosseguir da seguinte
forma:
1. Comece
com a marcação de início de listas <ul>
2.
Insira a marcação <li>
antes
de cada item da lista (não é necessário fechar a notação
com </li> pois o parâmetro <li> refere-se somente a um item
de cada vez)
3.
Encerre com a marcação de final de lista </ul>.
Um exemplo de elaboração de listas não numeradas:
<html>
<head>
<title>Título</title>
</head>
<body>
<h2>Exemplo de listas não numeradas</h2>
Este exemplo mostra como elaborar uma lista não numerada. Vamos
listar frutas:<br>
<ul>
<li>Maçã
<li>Banana
<li>Uva
<li>Abacate
</ul>
</body>
</html>
E fica deste jeito:
É importante lembrar que cada marcação <li> pode conter vários parágrafos, em casos de textos grandes em listas.
Uma lista numerada (ou ordenada) é semelhante a uma lista não
numerada, exceto porque se usa a marcação <ol>
no
lugar de <ul>.
Cada item da lista deve aparecer com a tag <li>,
da mesma forma como é feito nas listas não numeradas.
Vamos elaborar uma lista numerada semelhante à mostrada acima:
<html>
<head>
<title>Título</title>
</head>
<body>
<h2>Exemplo de listas não numeradas</h2>
Este exemplo mostra como elaborar uma lista não numerada. Vamos
listar frutas:<br>
<ol>
<li>Maçã
<li>Banana
<li>Uva
<li>Abacate
</ol>
Este é um texto para mostrar a eficiência da tag de fechamento.
Perceba que como fechamos a lista, este texto não é mostrado
como item.
</body>
</html>
As listas intercaladas são bem semelhantes às não
numeradas e as numeradas. Elas produzem itens secundários dentro
de itens principais, ou seja, criam uma lista dentro da outra. Pode-se
inclusive ter um parágrafo, intercalando com uma lista que contenha
um único item.
Exemplo de lista intercalada não numerada (colocadas só a
marcações de lista, sem as marcações básicas,
mostradas anteriormente em vários exemplos):
<ul>
<li>Alguns Estados da região
sul do Brasil:
<ul>
<li>Rio Grande do
Sul
<li>Santa Catarina
</ul>
<li>Alguns Estados da Região
Nordeste do Brasil:
<ul>
<li>Pernambuco
<li>Ceará
<li>Bahia
</ul>
</ul>
Colocando as marcações anteriores de html, head e título, estas marcações darão origem a este exemplo:
Uma lista de definições normalmente consiste em alternar
um termo e atribuir a ele uma definição. Como se mostrasse
um título e embaixo a sua explicação. Usa-se quando
temos vários itens e queremos explicá-los. Os navegadores
geralmente mostram o termo em uma linha e a definição em
outra linha, com outro alinhamento.
Para criar uma lista de definições são usadas marcações
um pouco diferentes das anteriores. A tag de iniciação de
uma lista de definições é <dl>,
para cada novo termo é usado <dt>
e
para as definições <dd>.
Você pode colocar várias definições para um
mesmo termo, para isso basta colocar outra marcação <dd>
antes de colocar a marcação de termo <dt>
novamente.
Observe a lista de definições usada para um dicionário
inglês/português:
<html>
<head>
<title>Título</title>
</head>
<body>
<h2>Exemplo de lista de definições</h2>
<dl>
<dt>PERNICIOUS
<dd>Nocivo, pernicioso, maligno (adj.)
<dt>PHONE
<dd>Telefone (subs.), telefonar (ver.)
<dd>* BOOTH - Cabine telefônica
(subs.)
<dd>* BOX - Cabine telefônica
(subs.)
<dd>* CALL - Telefonema, ligada (subs.)
<dt>PHOTOGRAPH
<dd>Fotografia(subs.), fotografar (ver.)
</dl>
Este é um texto fora da lista.
</body>
</html>