Uz pomoć kompetentnog HTML koda i jednostavnih CSS pravila možete stvoriti skočni meni, dopuniti ga i izmijeniti. Korištenjem kaskadnih tablica i alata za označavanje jezika možete osigurati da sam meni ispravno radi u svim pregledačima.
Instrukcije
Korak 1
Prvo se držite osnovne trake menija. Stvorite posebnu numeriranu listu sa podizbornikom u uređivaču teksta. Obično se u ove svrhe koristi "Notepad". Podmeni djeluje kao element nadređene liste. Na primjer: Prvi elementFlood ElementFlood Element2Field Element3Field Element4Field Element5
Korak 2
Spremite ovu listu u zasebnu html datoteku. Zatim stvorite.css datoteku. Unesite sve potrebne parametre tabele stilova. Učinite to vrlo pažljivo, jer je jedna greška, a skočni izbornik neće se pravilno prikazati ili uopće neće raditi.
Korak 3
Uklonite sve metke i obloge primijenjene na listi metaka. Postavite širinu izbornika pomoću CSS alata: ul -style: none; width: 200px; }
Korak 4
Označite relativni položaj svih stavki na popisu atributom koji se naziva pozicija: ul li: relativni; }
Korak 5
Zatim uredite podmeni, čiji će se elementi pojaviti iz roditeljskog izbornika udesno kada se kursor miša nalazi iznad stavke: li ul: absolute; lijevo: 199px; top: 0; display: none; }
Korak 6
Lijevi atribut je jedan piksel manji od širine samog izbornika. To omogućava pravilno postavljanje iskačućih stavki bez stvaranja dvostrukih obruba. Atribut prikaza koristi se za skrivanje podizbornika prilikom otvaranja stranice.
Korak 7
Po potrebi oblikujte veze koristeći odgovarajuće css opcije. Uključite parametar display: block tako da veze zauzimaju sav prostor rezerviran za njih. Da bi se izbornik pojavio kada se kursor miša zadrži nad njim, unesite sljedeći kod: li: hover ul: block; }
Korak 8
Po želji postavite dodatne opcije za prikaz stavki liste i veza. Uključite atribut u.html datoteku. Skočni meni je spreman za upotrebu.
