Dreamweaver CS3 - Adobe

A
A. Containerelement B. Sidebar div C. Element Hoofdinformatie (Main Content)
Hier volgt de codering voor alle drie div-elementen in de HTML:
Sidebar Content
Lorem ipsum dolor sit amet, consectetuer adipiscing elit.
Maecenas urna purus, fermentum id, molestie in, commodo porttitor, felis.
DREAMWEAVER CS3
Handboek
Main Content
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Praesent aliquam, justo convallis luctus
rutrum.
Phasellus tristique purus a augue condimentum adipiscing. Aenean sagittis. Etiam leo pede, rhoncus
venenatis, tristique in, vulputate at, odio.
H2 level heading
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Praesent aliquam, justo convallis luctus
rutrum, erat nulla fermentum diam, at nonummy quam ante ac quam.
In het bovenstaande voorbeeld is er geen “stijl” verbonden aan de div-elementen. Als er geen CSS-regels zijn opgegeven,
worden alle div-elementen met hun informatie op de standaard plaats op de pagina aangebracht. Als echter ieder divelement
van een unieke ID is voorzien (zoals in het bovenstaand voorbeeld), kunt u de IDs gebruiken om CSS-regels te
maken zodat deze (als ze worden toegepast) de stijl en de positionering van de div-elementen kunnen wijzigen.
De volgende CSS-regel, die zich in de kop van een document of in een extern CSS-bestand kan bevinden, geeft de stijlregels
voor het eerste div-element (het “containerelement”) op de pagina:
#container {
width: 780px;
background: #FFFFFF;
margin: 0 auto;
border: 1px solid #000000;
text-align: left;
}
De #containerregel past een stijl toe op het container-div-element waardoor het een breedte krijgt van 780 pixels, een witte
achtergrond, geen marge (vanaf de linkerkant van de pagina), een vast en zwart kader van 1-pixel en tekst die links is
uitgelijnd. Het resultaat van toepassing van de regel op het container-div-element is als volgt:
B
C
141