15.10. Ejercicio 10
Modificar el menú vertical sencillo para que muestre el siguiente comportamiento:
1) Los elementos deben mostrar una imagen de fondo (flecha_inactiva.png):
Figura 15.13 Menú vertical con imagen de fondo
2) Cuando se pasa el ratón por encima de un elemento, se debe mostrar una imagen alternativa (flecha_activa.png):
Figura 15.14 Menú vertical con imagen de fondo alternativa
3) El color de fondo del elemento también debe variar ligeramente y mostrar un color gris más oscuro (#E4E4E4) cuando se pasa el ratón por encima:
Figura 15.15 Menú vertical con imagen de fondo y color alternativos
4) El comportamiento anterior se debe producir cuando el usuario pasa el ratón por encima de cualquier zona del elemento del menú, no solo cuando se pasa el ratón por encima del texto del elemento (este problema sólo sucede con Internet Explorer 6):
Figura 15.16 Aspecto final del menú vertical avanzado creado con CSS
Descargar imagen flecha_inactiva.png
Compartir
Indice de contenidos
- 1 Introducción
- 2 Selectores
- 3 Unidades de medida y colores
- 4 Modelo de cajas
- 5 Posicionamiento y visualización
- 6 Texto
- 7 Enlaces
- 8 Imágenes
- 9 Listas
- 10 Tablas
- 11 Formularios
- 12 Layout
- 13 Otros
- 14 Recursos útiles
- Capítulo 15. Ejercicios
- 15.2. Ejercicio 2
- 15.3. Ejercicio 3
- 15.4. Ejercicio 4
- 15.5. Ejercicio 5
- 15.6. Ejercicio 6
- 15.7. Ejercicio 7
- 15.8. Ejercicio 8
- 15.9. Ejercicio 9
- 15.10. Ejercicio 10
- 15.11. Ejercicio 11
- 15.12. Ejercicio 12
- 15.13. Ejercicio 13
- 16 Ejercicios resueltos