May 16
I siti web moderni richiedono interattività con l'utente il più possibile, e l'aggiunta di stati rollover per i pulsanti di navigazione è uno dei modi più semplici per farlo. Non è necessario spendere soldi per Dreamweaver o Fireworks; è possibile creare rollover interattivi con HTML e CSS.
1 Prova la tua pagina Web per assicurarsi che i link HTML di base funzionano correttamente. Rollover sui collegamenti interrotti non migliorerà il vostro sito. Se i collegamenti funzionano, aprire il file HTM pagina Web in qualsiasi editor di testo.
2 Aggiungere una dichiarazione foglio di stile. Posizionare il cursore all'interno dei tag e del tipo <head>:
<P>
<Style type = "text / css">
</ Style>
</ P>
3 Posizionare il cursore tra i nuovi tag <style>. Aggiungere un ritorno a capo e dichiarare il vostro (pulsante) stile di ancoraggio: "a {}" (ritorni a capo aiuterà a seguire il codice, ma non influiscono sul browser).
4 Inserisci il tuo dichiarazione di stile tra le parentesi graffe ({}). È necessario includere "display: block; larghezza: 5em (o qualsiasi altro larghezza in" spaziatura em "); background-color: # 000000 (o qualsiasi altro valore, ad esempio, # 85DE59); color: #aaaaaa (o qualsiasi altro valore ); text-align: center; " nella dichiarazione. Quando si visualizza in anteprima la pagina nel browser, il vostro link sarà apparire come pulsanti rettangolari.
5 Definire il valore di rollover nella sezione stili CSS: "a: hover {}"; nella definizione di stile, aggiungere valori diversi per "background-color" e "colore".
6 Testare l'immagine nel tuo browser per assicurarsi che i collegamenti cambiano colore quando il mouse si trova sopra i pulsanti. Se le modifiche un collegamento, lo faranno tutti i cambiamenti.