Menüü koostamine on tõenäoliselt üks peamisi punkte saitide ja programmide väljatöötamisel. Lisaks on sellise menüü hea väljatöötamine ja loogiline kujundamine saidi või mis tahes programmi nägu. Võtame näiteks Microsofti ja operatsioonisüsteemi Windows 7. Pärast Windows 7 väljaandmist kuulis Microsoft palju kriitikat, mis polnud enda jaoks meelitav. Kriitikat on olnud palju, kuid enamasti ebamugavalt paigutatud menüüelemendid. Lugege seda õpetust hoolikalt läbi, kuidas luua horisontaalset rippmenüüd CSS-i ja Expression Webi abil. Menüü loomiseks muutuvad sildi stiilid
Juhised
Samm 1
Minge jaotisse Stiilide haldamine ja seejärel klõpsake nuppu Uus stiil. Pange äsja loodud uuele stiilile nimi Selector ul li. Samuti pidage meeles, et veenduge, et uus stiil tuleks määratleda rippmenüüs.css.
2. samm
Horisontaalse menüü venitamiseks peate menüüelementidele ütlema, et see on horisontaalne. Järgmisena peate määrama iga menüüelemendi laiuse ja eemaldama kõik loendipunktide ees olevad mittevajalikud punktid.
3. samm
Horisontaalse joonduse jaoks minge jaotisse Paigutus ja määrake kuva atribuut tekstisiseseks. Määrake ujuki atribuut vasakule. Klõpsake nuppu Rakenda. Kõik loendi üksused peavad olema seatud ühele reale. Selleks, et nad üksteisega ei kattuks, peate tegema järgmist: määrake atribuudi Laius väärtuseks 150 pikslit. Nüüd kontrollige seda. Kõik loendi elemendid peaksid saama ühesuurused.
4. samm
Nüüd peame proovima eemaldada loendikirjete ees olevad punktid. Selleks minge loendisse ja määrake atribuudi list-style –type väärtuseks ükski.
5. samm
Kõigi muudatustega nõustumiseks klõpsake nuppu OK.
6. samm
Ul li stiili fondisuuruse kohandamiseks peate tegema järgmist. Paremklõpsake menüüs Stiilide haldamine ul stiili, mille valimiseks valige Stiili muutmine. Avaneb tuttav dialoogiboks atribuutide lisamiseks või muutmiseks. Minge kategooriasse Font ja määrake font-family atribuudiks Arial, Helvetica, sans-serif. Järgmisena minge atribuudile font-size ja määrake väärtuseks 0.9em. Pärast seda seadistage atribuut text-transform, määrake selle väärtuseks suurtäht.
7. samm
Loodud menüü üksuste kõrgust saab reguleerida kategoorias Positsioon. Määrake atribuudi kõrgus 30 pikslit.
8. samm
Järgmisena peate salvestama faili menu.html. Selleks avab Expression Web faili salvestamiseks vajaliku akna Salvesta manustatud failid. Salvestage rippmenüüs.css fail. Salvestamiseks klõpsake nuppu OK.
9. samm
Nüüd kontrollige oma tulemust. Töökindluse tagamiseks on parem seda testida erinevates brauserites. Vaikebrauseris saadud tulemuse kontrollimiseks peate vajutama klaviatuuril klahvi F12.