6.1 Introducción a las listas

Las listas HTML son un recurso muy utilizado tanto por diseñadores y desarrolladores web como por blogueros, pero la verdad es que por defecto suelen estar bastante desnutridas en cuanto a diseño.

6.2 Listas actualizadas

Con CSS, podemos crear efectos y estilos que convierten nuestra lista en un elemento muchísimo más moderno. A continuación, vamos a ver algunos ejemplos de listas modernas:

Ejemplo 1:

Vamos a maquetar una lista ordenada donde se resalten los números y cada elemento de la lista. Al pasar el ratón vamos a destacar el elemento actual.

Ejemplo 2

Vamos a maquetar una lista ordenada parecida a la anterior, pero en vez de círculos, vamos a poner cuadrados.

6.3 Listas que no lo parecen

A las listas, aparte de aplicarles estilos para que parezcan más modernas, también les podemos aplicar otros estilos para que no se parezcan a nada a una lista. Gracias a esta técnica, podemos conseguir grandes efectos como las que encontramos en el siguiente enlace: Ejemplos de listas que no lo parecen.