Een van de belangrijkste aspecten bij de ontwikkeling van software en websites is het maken van menu's. Microsoft en zijn beroemdste geesteskind, het Windows-besturingssysteem, moeten als een goed voorbeeld worden genomen. Ondanks het feit dat dit product door de overgrote meerderheid van pc-gebruikers in de wereld wordt gebruikt, neemt de kritiek niet alleen niet af, maar groeit ze voortdurend. Kortom, het gaat om het ongemak van de locatie van menu-items. Het volgende is een beschrijving van het maken van menu's in CSS en Expression Web.
instructies:
Stap 1
Om te beginnen met het maken van een horizontaal menu, gaat u naar Stijl beheren en klikt u op de knop Nieuwe stijl. Noem de nieuwe stijl Selector ul li. Belangrijk! Zorg ervoor dat het gegenereerde bestand de extensie drop-down.css heeft. Om een horizontaal menu te maken, geeft u aan het aangemaakte element aan dat het exact horizontaal zal zijn. Bepaal vervolgens de breedte van elk menu-item en verwijder alle onnodige punten die voor alle items in de lijst zijn geplaatst.
Stap 2
Ga naar de optie Lay-out, stel het kenmerk Weergave in op Inline om horizontale uitlijning uit te voeren. Stel vervolgens de waarde Links in op het kenmerk Zwevend en klik op de knop Toepassen. Stel alle lijstitems in op één regel. Om ervoor te zorgen dat ze netjes worden geplaatst en niet op elkaar kruipen, stelt u in het kenmerk Breedte de waarde Positie in op 150 px. Controleer of alle elementen van de lijst even groot zijn. Verwijder vervolgens de puntjes voor alle elementen - ga hiervoor naar het List-attribuut en stel de parameter None in het List Style-type item in. Klik op OK om alle wijzigingen te accepteren en toe te passen.
Stap 3
Pas de lettergrootte en -stijl aan voor de ul li. Ga hiervoor naar Stijlen beheren en klik met de rechtermuisknop op de ul li en selecteer vervolgens Stijl wijzigen. Het bekende dialoogvenster verschijnt. Ga naar Lettertype, selecteer het kenmerk Font-familie en stel het in op Sans-serif, Arial, Helvetica. Pas vervolgens de lettergrootte aan door deze in te stellen op 0, 9. Stel daarna het kenmerk Teksttransformatie in op Hoofdletters. Pas de hoogte van de menu-items in het kenmerk Hoogte - Positie aan en stel de waarde in op 30 px.
Stap 4
Nadat u alle corrigerende acties hebt uitgevoerd, slaat u het bestand op als menu.html. Test vervolgens het gemaakte menu in verschillende browsers om er zeker van te zijn dat het correct werkt. Zoals u kunt zien, is het ontwerp van het horizontale menu vrij eenvoudig.
