Stap 5: Voeg enkele extra divs voor structuur in navigatie
Wijzig het volgende stukje code:
< div id = "nav" >
< div class = "navblock" >
< ul >
Foo < li > < /li >
< li > Bar < /li >
< /ul >
< / div >
< / div >
We zullen nu advertentie een stukje code om te definiëren hoe de div "navblock" heeft moeten worden weergegeven.
Merk op dat de navblock een klasse, niet een id heeft. De reden hiervoor is simpel; div-elementen met een id worden slechts een keer weergegeven (het blok van de navigatie, header, voettekst,...). Div-elementen met klassen kunnen meerdere malen worden weergegeven. We zullen hier een klasse gebruiken. Alleen in geval zullen we willen een ander navigatie blok later toevoegen.
div.navblock {}
breedte: 180px;
marge: 5px auto;
rand: 1px solid rood;
}
Als we toevoegen een ander blok van navigatie willen, moet u gewoon toe te voegen een nieuwe < div class = "navblock" >... < / div > structuur.
Uw code ziet er nu als volgt uit;
< div id = "nav" >
< div class = "navblock" >
< ul >
Foo < li > < /li >
< li > Bar < /li >
< /ul >
< / div >
< div class = "navblock" >
< ul >
< li > Boo < /li >
< li > ver < /li >
< /ul >
< / div >
< / div >
