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
. 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.
Woah! I’m really digging the template/theme of this website.
It’s simple, yet effective. A lot of times it’s very hard to
get that «perfect balance» between superb usability and visual appearance.
I must say you’ve done a fantastic job with this. Additionally,
the blog loads super quick for me on Chrome. Excellent Blog!