Hvordan bruke CSS Div Tags
Webutviklere ofte dele websider i seksjoner, for eksempel en header, kropp og bunntekst. Flere elementer innen HTML brukes til å definere en Web-sidens layout, som tabeller, lag og div koder. Tabeller pleide å være det foretrukne valget for å dele websider. Men på grunn av begrensningene i tabeller til side belastning, fleksibilitet og kompatibilitet med nettlesere, flere web forfattere bruker div koder og CSS for sine oppsett og formatering.
Bruksanvisning
1 Klikk "Start", "programmer," "Tilbehør" og "Notisblokk".
2 Skriv eller kopier og lim inn følgende HTML-kode i Notisblokk:
<Html>
<Style type = "text / css">
header {
background-color: #0066FF;
høyde: 50 piksler;
width: 600px;
}
kropp {
background-color: #FFFF99;
height: 300px;
width: 600px;
}
footer {
background-color: #009900;
høyde: 50 piksler;
width: 600px;
}
</ Style>
<Body>
<Div id = "header"> Dette er en overskrift på nettsiden </ div>
<Div id = "body"> Dette er kroppen av websiden </ div>
<Div id = "footer"> Dette er bunnteksten på nettsiden </ div>
</ Body>
</ Html>
Den foregående koden bruker HTML div tags (<div> </ div>) for å lage en layout som består av en header, kropp og bunntekst. Den bruker CSS koding innen stilen koder for å formatere deres egenskaper, inkludert deres bakgrunnsfarge, bredde og høyde.
3 Klikk "Fil" og "Lagre som". Velg "Alle filer" som "Lagre som type."
4 Gi filen et navn og legg .html på slutten av filnavnet for å lagre det som et HTML-dokument. Eksempel: mypagelayout.html.
5 Finn ut dokumentet på harddisken, og dobbeltklikk på den. Det bør åpne opp i nettleseren. Du skal se en farge layout bestående av tre divisjoner: en overskrift, en kropp og bunntekst.