Hvordan lage menyer som kan tilpasses i Adobe Dreamweaver CS3

Hvordan lage menyer som kan tilpasses i Adobe Dreamweaver CS3


Dreamweaver, en ledende web-side design program, støtter mange måter å lage menyer. En av de enkleste og mest vanlige metodene er programmet innebygde Spry menylinjen, en av Dreamweaver er flere forhåndskonfigurerte Spry Framework eiendeler. Med bare noen få museklikk, skaper Spry menylinjen på menyen for deg, og deretter kan du bruke gripende stilark, eller CSS, for å tilpasse menyen.

Bruksanvisning

1 Åpne en eksisterende HTML-side i Dreamweaver, eller starte en ny side: Klikk på "File" -menyen og velg "New" for å åpne dialogboksen Nytt dokument. Velg "HTML" fra listen Sidetype velger du oppsettet du ønsker fra "Layout" -listen, og klikk deretter på "Create".

For eksempel, hvis du ønsker å lage en horisontal meny, velg "en kolonne fast, sentrert, topp- og bunntekst" alternativet. Dette skaper en layout med CSS header beholder for din meny. Hvis du ønsker å lage en vertikal meny, velg "2 kolonne fast, venstre sidebar" alternativet. Dette skaper en layout med CSS sidebar beholder for din meny.

2 Klikk i CSS beholder hvor du ønsker å lage en meny for å sette markøren. Hvis dette er en ny side, ber Dreamweaver du å lagre siden. Klikk "OK" for å vise dialogboksen Lagre som. Navn siden og klikk "Lagre". De Spry menylinjen vises dialogboksen.

3 Velg den typen menyen du ønsker. For å lage en meny øverst på websiden, velg "Horisontal". For å lage en meny langs siden av websiden, velg "Vertical".

4 Velg den første menyen etiketten tekst, "Sak 1," og skriv menypunktet etiketten i "Text" feltet i Properties panelet. Gjenta dette trinnet for å lage etiketter for hvert menyelement.

Du kan legge til et ekstra menyvalg fra panelet Egenskaper. For å legge til en topp-nivå menyelement, klikker du plusstegnet (+) over den første kolonnen i panelet, og deretter navnet på menyvalget i "Text" feltet. For å legge til andre og tredje nivå menyelementer, klikker du plusstegnet (+) over den andre og tredje kolonner i Properties panelet, henholdsvis, og deretter endre etikettnavn i "Text" feltet.

5 Klikk på det første menyelementet boksen på siden for å sette markøren.

6 Klikk på "Rediger regel" i Properties panelet for å åpne dialogboksen Definisjon CSS Rule boksen. Herfra kan du endre menyelement skrift, bakgrunn, boks form, og boksen grenser. For eksempel vil endre menyelementet boksen bakgrunn, velg "Bakgrunn" i Kategori-listen. Dette viser alternativer for å tilpasse bakgrunnen. Du kan endre farge fra bakgrunns - Color swatch fly ut, eller du kan velge et bakgrunnsbilde fra background-image-feltet.

7 Klikk på "Apply" for å godta endringene. Gjenta denne prosedyren for hvert menyelement eiendom du ønsker å endre.

8 Klikk "OK" for å lukke dialogboksen Definisjon CSS Rule boksen.

Hint

  • Når du lagrer siden, skaper Dreamweaver en mappe som heter SpryAssets. Denne mappen inneholder bilder og skript for menyen. Når du laster opp siden til en webserver, må du også laste opp denne mappen. Ellers vil ikke menyen vises riktig.