Publicado en html5

Lista sin numerar avanzada en html5

Buenas otra vez a todo el mundo, esta vez os voy a enseñar como hacer una lista sin numerar avanzada haciendo varios niveles de anidamiento.

Imaginaos que queremos crear esto:

1

Recordad que sería con:

«<ul>» para la lista

«<li>» para cada elemento de la lista

Pues el código sería así:

3

Y en el navegador quedaría así:

1

Os voy a explicar como lo he hecho paso a paso:

Primero se ponen las etiquetas  <ul> y </ul>después otros «ul» dentro para que se sepa que es aparte y ahora todo lo demás dentro.

Captura1

Después del primer <ul></ul> se ponen dentro de estos más <ul></ul> y <li></li>

Captura2

Después abajo de «<li>hola</li>» se pone el «<ul></ul>» para que se sepa que es aparte y después del <ul> último se pone otra vez <li></li> para que salga el siguiente ejemplo:

Captura3

Ahora voy a poner el «gracias»

Captura4

Y por último sería «espero que tu también»

Captura5

Lo voy a explicar con números… imaginaos que tengo el <ul>=1 y <li> =2 entonces:

rectangulo

Espero que os haya ayudado.

Deja un comentario

Este sitio utiliza Akismet para reducir el spam. Conoce cómo se procesan los datos de tus comentarios.