Hva er en DIV layout?

I både HTML og CSS, "div" står for divisjon eller seksjon, og er skrevet som "<div>" tag. Den "<div>" layout bruker block formatering å style websiden, mye på samme måte som tradisjonelle tabeller. Men definerer "<div>" layout hver av dens seksjoner, kan være enten en fast eller flytende layout, og har forskjellig kodeattributter for ytterligere å definere oppsettet.

innhold Container

HTML koding i mellom "<div"> start tag og "</ div>" end tag, befinner seg innenfor divisjon blokk, skape et innhold container. Disse innholds container blokkene er grunnstrukturen for en "<div>" layout. Tabeller bruke rader og kolonner for å lage innhold beholdere, men de er ikke så lett å endre eller manipulere som "div" layout. Den "<div>" layout er bygd på individuelle blokker av innhold, snarere enn et overleggs struktur rader og kolonner.

Layout Seksjoner

Den "<div>" layout ikke bruker tradisjonelle rader og kolonner i et stort bord. Snarere bruker "<div>" layout "#header", "#footer" og "#leftcol", "#rightcol" eller "#content"> delkodene å strukturere websiden. Hver av disse delkodene har sin egen bredde, høyde, marger, padding, bakgrunnsfarger og link farger. Videre hver av disse delene kan bli gitt en "id" av "header", "bunntekst", "venstre kolonne" eller "høyre kolonne," deretter omplasseres i nettsiden layout. Oppsettet er fleksibelt og godt egnet til multi-kolonne nettsider.

Faste og Fluid utforminger

En fast "<div>" layout forblir samme størrelse uansett hvor stor skjermen er, mens en væske "<div>" layout utvides og kontrakter med størrelsen på dataskjermen. Faste utforminger bruke faste piksel bredder og høyder for hver av de innholds seksjonene. Fluid oppsett kan bruke enten prosenter for seksjons dimensjoner, eller bruk "flyte" tag å flyte oppsettet til venstre eller høyre. Den prosentvise bredder og høyder er direkte relatert til størrelsen på dataskjermen. For eksempel, en bredde på 80 prosent forårsaker "<div>" layout for å ta opp 80 prosent av skjermen.

tag attributter

Ulike tag attributter kan brukes sammen med "<div>" tag å endre layout. Den vanligste er "align", som justerer oppsettet til venstre eller høyre. Andre egenskaper inkluderer "klasse", som definerer et element classname, den "id" tag identifisere en layout element, "style" tag som spesifiserer en inline stil, og "title", som gir et element tittel for meta-informasjon og SEO (søkemotoroptimalisering).