Il tag "selezionare" è il modo più lungo-levantesi in piedi per fare un menu a discesa sulla tua pagina Web, ma poiché Cascading Style Sheets (CSS) sono stati introdotti, i menu con le apparenze molto personalizzabile sono diventati popolari. Molti tali menu a discesa personalizzati utilizzare JavaScript per rivelare o nascondere voci di menu basati sulle azioni del mouse dell'utente. Tuttavia, la pseudo-classe "hover" in CSS utilizzabile anche per rivelare le voci di menu quando il puntatore del mouse viene spostato sopra il menu, quindi non è JavaScript è necessario.

Istruzioni

1

Inserire il seguente codice CSS tra i tag di "head" del documento HTML:

< style type = "text/css" >

{. menu

display: inline-block;

Posizione: parente;

}

.menucontent () {

visibilità: nascosto;

Posizione: absolute;

Larghezza: 100%;

}

.menu:hover .menucontent () {

visibilità: visibile;

}

< / stile >

2

Aggiungere il seguente codice al corpo del documento HTML:

< div class = "menu" > Menu a discesa

< span class = "menucontent" >

< un href="page1.html" > 1 elemento < /a >

< un href="page2.html" > 2 elemento < /a >

< un href="page3.html" > 3 elemento < /a >

< / span >

< / div >

3

Salvare la pagina e caricarlo in un browser Web. Muovi il mouse sopra il testo di "Drop-down Menu", e le voci di menu vengono visualizzati. Inserire qualsiasi contenuto HTML che ti piace tra i tag "span" per fare un menu su misura. Riutilizzare il codice HTML dove vuoi un menu a discesa sulla tua pagina.

Consigli & Avvertenze

• Aggiungere la seguente riga all'inizio del documento HTML (prima del primo tag "html") per garantire la compatibilità con Internet Explorer:
• <! DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 / / EN" "l'http://www.w3.org/TR/html4/strict.dtd" >
• Personalizzare l'aspetto del menu utilizzando la proprietà CSS come "background-color" e "di frontiera".