Hvordan bruke div koder for et innholdsoppsett
Legging ut innholdet på websiden er en viktig del av web design. Du kan bruke en rekke elementer i HTML for å dele en webside og legge ut innholdet på riktig måte, som tabeller, lag, spenn og DIV-koder. Brukes til å definere divisjoner i et HTML-dokument, DIV-koder er fleksible, enkle å bruke og kompatibel med nettlesere. De brukes ofte i forbindelse med gjennomgripende stilark (CSS) for å bedre layout, format eller forbedre innholdet på en webside. Bruk Divs og CSS, kan du opprette avdelinger på websiden, for eksempel overskrifter og sidefelt.
Bruksanvisning
1 Klikk "Start", "programmer," "Tilbehør" og "Notisblokk".
2 Skriv inn følgende tekst øverst i Notepad:
<Html>
<Style type = "text / css">
<! -
header {
height: 100px;
width: 500px;
background-color: #FFFFCC;
}
kropp {
height: 300px;
width: 500px;
}
Kroppen #sidebar {
height: 300px;
width: 80px;
float: left;
background-color: # 009900;
}
footer {
height: 100px;
width: 500px;
background-color: # 000000;
color: #FFFFFF;
}
->
</ Style>
</ Head>
<Body>
<Div id = "header"> Innhold for id "header" Goes Her </ div>
<Div id = "body">
<Div id = "sidebar"> Innhold for id "sidebar" Goes Her </ div>
</ Div>
<Div id = "footer"> Innhold for id "footer" Goes Her </ div>
</ Body>
</ Html>
Denne koden skaper fire DIV-koder ved hjelp av åpningen <div> og avsluttende </ div> HTML tag kombinasjoner. Koden deretter gir dem separate IDer: header, sidebar, kropp og bunntekst. Det skaper også en CSS blokk med åpningen <style> og lukking </ style> HTML tag kombinasjoner. Deretter formaterer den enkelte DIV tag attributter, som bakgrunnsfarge, posisjonering, bredde og høyde, for å danne en webside layout. Du kan nå sette inn innholdet i de enkelte DIV-koder.
3 Klikk "Fil" og deretter "Lagre som". Velg "Alle filer" som "Lagre som type."
4 Lagre filen som en HTML-fil på datamaskinen ved å plassere HTML på slutten av filnavnet, for eksempel usingDivTags.html.
5 Finn din HTML-filen der du lagret den på datamaskinen, og dobbeltklikk på den. Det bør åpne opp i nettleseren og presentere deg med en fargerik, fire-sided layout.