Listas ordenadas en HTML

15/Dic/2013 HTML 2 Comentarios

En este ejemplo vamos a ver como podemos crear listas ordenadas en HTML. Las listas ordenadas en HTML nos sirven para mostrar una lista de elementos con un orden. Para ello en HTML se visualiza como una lista, anteponiendo a cada uno de los elementos el orden que tiene en la lista.

El elemento que nos permite crear listas ordenadas en HTML es OL.

  1. <ol>...</ol>

Y cada uno de los elementos de las listas ordenadas en HTML se establecen mediante el elemento LI.

  1. <li>Elemento 1</li>
  2. <li>Elemento 2</li>
  3. ...
  4. <li>Elemento N</li>
  5. </ol>

Si lo que queremos es mostrar una lista ordenada con las provincias españolas atendiendo al número de habitantes tendremos que utilizar el siguiente código HTML:

  1. <li>Madrid</li>
  2. <li>Barcelona</li>
  3. <li>Valencia</li>
  4. <li>Alicante</li>
  5. <li>Sevilla</li>
  6. </ol>

Cada uno de los elementos va dentro del elemento elemento LI y todos los elementos los hemos anidados en la lista ordenada, es decir, dentro del elemento OL.

El resultado de la lista ordenada en HTML que tendremos por pantalla será el siguiente:

  1. Madrid
  2. Barcelona
  3. Valencia
  4. Alicante
  5. Sevilla

Vemos que delante de cada uno de los elementos de la lista ordenada aparece el número de su orden.

Espero que os haya servido el ejemplo para poder montar vuestras listas ordenadas en HTML.

Vídeos sobre HTML


¿Algo que nos quieras comentar?

Déjanos tu comentario, no te preocupes que tu email no será publicado

*

*