Hvordan du legger til væskeelementer i en layout i Dreamweaver - dummies

Når du har opprettet et fluidnettoppsett i Dreamweaver, er neste trinn å legge til koder eller andre elementer for å gjøre opp delene av designet. Du har to alternativer når du designer sider i Dreamweaver CC: bruk tagger eller bruk HTML5-koder.

Begge fungerer på samme måte i disse væskeoppsettene, men ved hjelp av HTML5-koder, for eksempel og taggene, har det noen fordel, fordi kodene legger til ekstra mening og struktur for websiden din.

Følg disse instruksjonene for å legge til koder, HTML5-koder og andre elementer i et flytnettgalleri:

1. Velg Sett inn → Struktur → Navigasjon.

   Alternativt kan du klikke på Navigasjon i Structure Insert-panelet.

2. Merk av for Insert as Fluid Element i dialogboksen Sett inn.

   Når du bruker installasjonsfunksjonene for fluidnett, må du velge dette alternativet når du legger til koder.

   

3. I dialogboksen Sett inn, velg om du vil bruke klassen eller ID-väljeren til å lage en ny stil for taggen du setter inn, og skriv deretter inn et navn for den nye stilen.

   Selv om du setter inn HTML5-koder, må du opprette en tilsvarende klasse eller ID-stil som kan brukes til å formatere elementet i alle tre layoutene.

   Klassestilnavnet må begynne med en prikk (.) Og ID-stilnavn må begynne med pundstegnet (#).

4. Klikk på OK.

   Etiketten legges til i oppsettet, danner en ny boks i oppsettet, og det tilsvarende stilnavnet legges tre ganger til CSS-oppsettet.

5. Velg den opprinnelige taggen som ble inkludert i oppsettet, og klikk deretter på ikonet for liten søppelkasse som vises nederst til høyre for taggen for å slette den.

   Selv om du kan beholde den første taggen som følger med i flytnettgrensesnittet, eller du kan omdøpe stilen som er brukt på den.

6. Velg Sett inn → Struktur → Artikkel.

   Dialogboksen Sett inn artikkel åpnes (ligner dialogboksen Sett inn overskrift).

7. Merk av for Insert as Fluid Element i dialogboksen Sett inn.

8. I dialogboksen Sett inn, velg om du vil bruke klassen eller ID-väljeren til å lage en ny stil for taggen du setter inn, og skriv inn et navn for den nye stilen.

9. Klikk på OK.

   Etiketten legges til i oppsettet, danner en ny boks i oppsettet, og det tilsvarende stilnavnet legges tre ganger til CSS-oppsettet.

10. Legg til så mange elementer som du vil for layoutet ditt, ved å gjenta trinn 6-9.

    Du kan legge til HTML5-elementer i flytgitterlayoutet ditt ved å klikke på de tilhørende ikonene i Structure Insert-panelet: en navigasjon, en overskrift, to artikler og en bunntekst .

    Merk at i koden legger Dreamweaver prefikset fluid- til navnet på hver stil du oppretter for dine flytnettoppsett.