CSS voorbeelden

Opmaak pagina met intern menu

Een pagina kan op meerdere manieren worden vormgegeven door gebruik te maken van CSS. Het meest eenvoudige voorbeeld is een pagina bestaande uit 1 kolom waarbij het menu in de tekst is opgenomen.

Een voorbeeld van een functioneel en eenvoudig webontwerp, maar echt bijzonder is dit natuurlijk niet.

Het ontwerp:

De pagina is opgebouwd uit twee delen, de dividers, die aangegeven worden met 'DIV'. Een voor de tekst en 1 voor het menu.

Daarbij is de Div voor het menu middels een 'float: left' op z'n plaats gezet. Dit wil zeggen dat de Div uit de normale opbouw gehaald wordt en uiterst links in het element waarin het zich bevindt, moet worden geplaatst.

Opmaak

De opmaak kan gewijzigd worden, er kunnen wat plaatjes aan toegevoegd worden en dan begint het al ergens op te lijken. De in de HTML aangebrachte structuur echter, beperkt het aantal mogelijkheden om de opmaak echt grondig te wijzigen.

Toch heeft een dergelijk eenvoudig ontwerp natuurlijk ook zijn voordelen. Het is makkelijk te onderhouden en vergt niet echt veel kennis van HTML en CSS om het naar eigen inzicht en smaak aan te passen.

Een kijkje in de keuken is natuurlijk altijd mogelijk. Gebruik uw rechter-muisknop en klik op 'bron weergeven' of 'view page-source' afhankelijk van uw browser.

Let wel: leren doe je niet door simpelweg te kopiëren!

Veel succes!