e nel caso volessi utilizzare i rollover?Originariamente inviato da pierofix
La tecnica migliore credo sia quelle che segue i seguenti princìpi:
- per prima cosa occorre realizzare il menu utilizzando una struttura di markup adeguata, ad esempio:
[*] poi occorre realizzare le due immagini di sfondo; poniamo il caso di averlo fatto, usando come dimensioni 200×50 px²;codice:
[*] adesso passiamo ai fogli di stile; dobbiamo porre i vari elementi di lista su una stessa riga, dare una dimensione fissa ai link (200×50) ed applicare l'immagine di sfondo:
[/list]codice:ul, ul * { margin:0; padding:0; } li { float:left; width:200px; height:50px; list-style-type:none; } li a { display:block; width:200px; height:50px; background:url('sfondo.gif') no-repeat 50% 50%; text-align:center; text-decoration:none; } li a:hover { background-image:url('sfondo-hover.gif'); }
In questo modo, come noterai, i pulsanti rimarranno testuali e le immagini saranno gestite come sfondi, favorendo qualsiasi tipo di dispositivo, anche, ad esempio, quelli usati dalle persone non vedenti per navigare in rete.
comunque grazie 1000!
Rispondi quotando