Las listas ordenadas son casi idénticas a las listas no ordenadas, salvo que en este caso los elementos relacionados se muestran siguiendo un orden determinado. Cuando se crea por ejemplo una lista con las instrucciones de un producto, es importante el orden en el que se realiza cada paso. Cuando se muestra un índice o tabla de contenidos en un libro, es importante el orden de cada elemento del índice.

En todos estos casos, la lista más adecuada es la lista ordenada, que se define mediante la etiqueta <ol>. Los elementos de la lista se definen mediante la etiqueta <li>, la misma que se utiliza en las listas no ordenadas.

Etiqueta<ol>
Atributos comunesbásicos, internacionalización y eventos
Atributos propios
Tipo de elementoBloque
DescripciónSe emplea para definir listas ordenadas

El siguiente código HTML muestra un ejemplo sencillo de lista ordenada:

<html>
<head><title>Esquema de un evento social</title></head>
<body>

<h1>Esquema de un evento social modo Tupac Bruch</h1>

<ol>
  <li>Invitar a las personas</li>
  <li>Esperar a que traigan cosas</li>
  <li>Cortar la luz para que se vayan</li>
  <li>Despedirlos cordialmente</li>
  <li>Una vez que se fueron, disfrutar de la fiesta</li>

</ol>

</body>
</html>

En el navegador la lista ordenada se ve de la siguiente manera:

Ejemplo de lista ordenada con conteo numeral.

El navegador muestra la lista de forma muy parecida a las listas no ordenadas, salvo que en este caso no se emplean viñetas gráficas en los elementos, sino que se numeran de forma consecutiva. El tipo de numeración empleada también se puede modificar aplicando hojas de estilos CSS a los elementos de la lista.

error: Content is protected !!
Ir arriba