Listas sin ordenar |
| ||
| |||
Las listas desordenadas son una colección de elementos sin ningún orden o secuencia especial. Las podemos utilizar cuando tengamos que presentar una serie de elementos sin que tenga importancia el orden, como por ejemplo, una lista de la compra.
La etiqueta <ul> indica al navegador que el contenido siguiente, hasta la etiqueta </ul>, es una lista de elementos sin ningún orden. Cada elemento de la lista se identifica mediante la etiqueta <li>.
La compra necesaria para cocinar albóndigas con guisantes:
<ul>
<li>600 g de carne magra de cerdo
<li>600 g de carne magra de ternera
<li>200 g de tocino
<li>Dos huevos
<li>Dos cebollas
<li>Seis tomates maduros
<li>Tres dientes de ajo
<li>50 de pan rayado
<li>100 g de harina
<li>500 g de guisantes
<li>Aceite, azafrán y perejil
<li>50 g de almendra
<li>Tres carquiñoles
<li>100 cl de vino blanco
<li>Canela en polvo
</ul>
<em>No debo olvidar coger el vale de descuento.</em>
Los navegador gráficos como Navigator e Internet Explorer asignan de manera automática a cada elemento etiquetado con <li> un círculo sólido. Podéis cambiar este símbolo por otra viñeta utilizando el atributo type en la etiqueta <ul>. Este atributo puede tener los valores disc, circle, o square.
<ul type = square>
 La lista no ordenada más común que encontraréis a menudo en una web es una colección de enlaces hacia otros documentos de HTML. |
EL HTML también permite colocar listas dentro de listas (listas nidadas), hecho que da lugar a un gran número de combinaciones y posibilidades. Observad el ejemplo siguiente:
<h3>Recetas de cocina de Gerona:</h3>
<ul>
<li>Entrantes:
<ul>
<li>Ensalada de patatas
<li>Sopa de cangrejo
<li>Coliflor con bechamel
<li>Huevos revueltos con espárragos
</ul>
<li>Carnes y aves:
<ul>
<li>Pollo con cebollas
<li>Espalda de cordero
</ul>
<li>Pescado:
<ul>
<li>Bacalao gratinado
<li>Calamarcillos en su tinta
<li>Salsita de pescado
</ul>
<li>Postres:
<ul>
<li>Pastel de berenjena
<li>Pastel de chocolate
</ul>
