Efter #wrapper - #header #content defines nedenstående
#footer som definerer bund arealet hvor information placeres
{ er start markering på parametre til #wrapper sectionen
} er slut markering på parametre til #wrapper sectionen
Imellem disse markeringer angives width - height - background-color for #headeren
Html kode
<head> |
<!-- Html tag--> |
<style> |
<!-- style start tag--> |
#wrapper { } |
<!-- angiver hele side arealet--> |
#header { } |
<!-- angiver hoved på siden--> |
#content { } |
<!-- arbejdsarealet på siden--> |
#footer { |
<!-- Her starter #footer--> |
height:50px; |
<!-- angiver højden på siden--> |
width:400px; |
<!-- angiver breden på siden--> |
background-color:yellow; |
<!-- angiver farven på siden--> |
} |
<!-- slut på på #footer--> |
</style> |
<!-- style slut tag> |
Nedenstående er Html koden som bruger stylingen defineret ovenfor
<Body> |
<!-- Html tag--> |
<div id="wrapper"> |
<!-- start div wrapper --> |
<div id="header"> |
<!-- start div header --> |
</div> |
<!-- slut div header --> |
<div id="content"> |
<!-- start div content --> |
</div> |
<!-- slut div content --> |
<div id="footer"> |
<!-- start div footer --> |
</div> |
<!-- slut div footer --> |
</div> |
<!-- slut div wrapper --> |
Html resultat
<div id=header>
</div>
<div id=content>
</div>
<div id=footer>
</div>
