Curso Programación Web – clase 7

Listas

 

En este capítulo aprenderemos a hacer listas…

<html>

<head>

<title>Título de la página web.</title>

</head>

<body>

<header>

<h1>Esta es la cabecera de la página</h1>

</header>

<!– esto es una lista no ordenada  –>

<p>Lista no ordenada</p>

<ul>

<li> opcion 1</li>

<li> opcion 2</li>

<li> opcion 2</li>

</ul>

<p>Lista ordenada</p>

<ol type=»1″>

<li> opcion 1</li>

<li> opcion 2</li>

<li> opcion 2</li>

</ol>

<p>Lista ordenada con letras</p>

<ol type=»A»>

<li> opcion 1</li>

<li> opcion 2</li>

<li> opcion 2</li>

</ol>

<p>Lista ordenada a partir de un numero</p>

<ol type=»1″ start=»10″>

<li> opcion 1</li>

<li> opcion 2</li>

<li> opcion 2</li>

</ol>

<p>Listas ordenadas anidadas</p>

<ol type=»1″ start=»1″>

<li> opcion 1</li>

<ol type=»A»>

<li> opcion A</li>

<li> opcion B</li>

<li> opcion C</li>

</ol>

<li> opcion 2</li>

<li> opcion 2</li>

</ol>

<hr />

<footer><i>Pie de página en cursiva<i></footer>

</body>

</html>

 

Podéis ver el resultado en

Listas

 

. el tag <ul> nos permite añadir una lista no ordenada de ítems.

. cada ítem debe tener el tag <li>

 

. el tag <ol> nos permite añadir una lista ordenada de ítems.

. en este caso el navegador incluye el número de ítem en la parte izquierda.

. cada ítem debe tener el tag <li>

 

. en las listas ordenadas podemos poner que indicador pone el navegador para cada línea, añadiendo el atributo type 

1 para números, A para letras, a para letras minúsculas, I para números romanos

 

. también podemos indicar a partir de qué número empieza a contar en la lista poniendo el atributo start

 

. podemos incluir una lista dentro de otra, para desglosar un ítem en varios puntos.

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *