Unidad 8. Menús (III)

8.5. Distintos estilos del elemento

Es habitual que los elementos de un menú tengan varios estilos distintos: el estilo normal; el estilo que muestra cuando tiene el cursor encima, que transmite al usuario la sensación de que se puede pulsar ése elemento; y un tercer estilo que diferencia el elemento "en el que estamos", es decir el que lleva a la página en la que el usuario está en ese momento, lo que le ayuda a situarse. Para esto podemos utilizar clases y pseudoclases.

Si no sabes cómo cambiar el estilo de un elemento al pasar el cursor sobre él, consulta este básico en el que te explicamos las pseudoclases.

También puede seguir el ejercicio paso a paso Utilizar pseudoclases CSS, en el que creamos un estilo para nuestro sitio de ejemplo.

Utilizar uno o varios de estos estilos dependerá del diseño que queramos conseguir.

Puedes practicar cómo crear algunos menús con el ejercicio paso a paso Crear menús básicos.

 

Ahora, vamos a darle formato al menú de nuestro ejemplo, para que tenga el mismo aspecto que en las siguientes imágenes:

Lo vamos a hacer siguiendo este ejercicio paso a paso.

 

Con los cambios realizados en el ejercicio, nuestro sitio de ejemplo habrá quedado como se ve aquí.

Ejercicio propuesto la Unidad 8

Prueba evaluativa de la Unidad 8