Menu e immagini sensibili con CSS - e-Lite

Transcript

Menu e immagini sensibili con CSS - e-Lite
02NPYPD - LINGUAGGI E AMBIENTI MULTIMEDIALI A
HTML E CSS
ESERCIZIO - SPERIMENTARE LE BARRE DEI MENU E LE IMMAGINI SENSIBILI
Utilizzando HTML e CSS creare una pagina Web con le seguenti caratteristiche:







Tutto il contenuto deve essere all’interno di un “wrapper” centrato nella pagina
In alto deve esserci un’intestazione, che deve contenere una barra di navigazione orizzontale
La barra di navigazione orizzontale deve modificare le sue caratteristiche (sfondo o colore del testo)
quando il mouse passa sopra a ciascun elemento, e deve indicare quale elemento del menu è
attualmente selezionato
Il restante contenuto deve essere organizzato in un layout a due colonne
La colonna a sinistra deve contenere una barra di navigazione verticale
La barra di navigazione verticale deve modificare le sue caratteristiche (sfondo o colore del testo)
quando il mouse passa sopra a ciascun elemento, e deve indicare quale elemento del menu è
attualmente selezionato
La colonna a destra deve contenere un’immagine sensibile (ad esempio memory.png oppure
qualunque altra a vostra scelta): alcune aree di questa immagine (che devono essere evidenti
quando il mouse cci passa sopra) devono condurre ad altri documenti
Materiale fornito: immagine memory.png. L’immagine memory.png deve avere come aree sensibili le aree
relative a “Long-term memory”, “Working Memory”, “Visual image store”, “Auditory image store”.
Esempio: