Una manera común y de utilidad de conseguir esquemas de forma sencilla, es colocar una lista dentro de otra lista.
Dentro de una lista podemos utilizar cualquier otra forma de lista, es decir, no tenemos porque mantener el mismo tipo de lista. Podemos incluir listas de definición, numeradas. etc.
Código de Ejemplo:
Representación en el navegador:
- Ejemplo de listas anidadas
- Titulo de la lista principal
-
- Primer elemento de la primer lista
- Segundo elemento de la primer lista
- Titulo de la 2da. lista
-
- Primer elemento de la 2da. lista
- Segundo elemento de la 2da. lista
- 3er. elemento de la 2da. lista
- 4to. elemento de la 2da. lista
Si en las listas no ordenadas, no especificamos el tipo de viñeta mediante el atributo type, el navegador cambiará automáticamente en cada anidamiento de la viñeta el nivel de profundidad.
Código de Ejemplo:
<html>
<head>
<title>Listas Anidadas No Ordenadas</title>
</head>
<body>
<basefont face="verdana" size="2" />
<b>Listas No Ordenadas Anidadas</b><br>
Paises y Ciudades:
<ul>
<li>España</li>
<ul>
<li>Almeria</li>
<li>Madrid</li>
</ul>
<li>Argentina</li>
<ul>
<li>Buenos Aires</li>
<li>Cordoba</li>
</ul>
<li>Reino Unido</li>
<ul>
<li>Londres</li>
<li>Manchester</li>
</ul>
</ul>
</body>
</html>
Representación en el navegador:
Listas No Ordenadas Anidadas
Paises y Ciudades:
- España
- Almeria
- Madrid
- Argentina
- Buenos Aires
- Cordoba
- Reino Unido
- Londres
- Manchester
Podéis encontrar más información sobre este tema en: Webestilo
Temas anteriores * http://bobuu.blogspot.com
70.- HTML - listas y párrafos
69.- HTML - Listas descriptivas <dl><dt>...</dt><dd>...</dd></dl>
68.- HTML - Listas no ordenadas - <ul><li>...</li></ul>
mas ... acceder al índice de temas ...
** Agradecemos visitéis nuestros Sponsors.
No hay comentarios:
Publicar un comentario
Gracias por tu comentario, en un maximo de 48 horas sera publicado.