DIV element

Modern Markup is op dit moment nog in ontwikkeling. Er is daarom altijd een kans dat je op een fout stuit. In dat geval zouden we het erg op prijs stellen als je deze fout bij ons zou melden. Bij voorbaat dank.

Het DIV element is een block-level element waarmee je andere block-level elementen kan groeperen. Uit zichzelf doet het DIV element niets, dus is dit element handig om bijv. te gebruiken met CSS om zo een gedeelte van de pagina op te maken.

Het is soms misschien verleidelijk om het DIV element voor zo'n beetje alles te gebruiken aangezien het zich goed leent voor CSS. Let wel: denk eerst na of je niet een betere oplossing kan bedenken i.p.v. gelijk naar het DIV element te grijpen. Zo zie je op veel sites de volgende code voor een menu:

Dit is een voorbeeld dat laat zien hoe het niet moet.

<div id="menu">
 <a href="/">Home</a> | <a href="/forum/">Forum</a> | <a href="/over">Over ons</a>
</div>

Zoals je ziet is er in de bovenstaande code gekozen voor een DIV element met daarin een aantal links wat een menu moet voorstellen. Echter, zoals we in het hoofdstuk Lijsten zagen, is het UL element veel beter geschikt om gebruikt te worden als een menu. Denk dus na voordat DIV element gaat gebruiken. Dit komt namelijk ten goede aan de kwalitiet van je code. Verder blijft het DIV element wel een goed groeperingselement dat makkelijk met CSS kan worden gebruikt.

De start tag is vereist. De eind tag is vereist.

Dit element wordt ook besproken in het hoofdstuk Je eerste website van de handleiding.

Voorbeeld van gebruik

<body>

<div id="top">
 <h1>Page title</h1>
 <ul>
  <li><a href="/">Home</a></li>
  <li><a href="/forum/">Forum</a></li>
  <li><a href="/over">Over ons</a></li>
 </ul>
</div>

<div id="inhoud">
 <!-- De inhoud van de pagina -->
</div>
</body>

Toegestane inhoud

De volgende elementen mogen één of geen één keer voorkomen: P; H1; H2; H3; H4; H5; H6; UL; OL; PRE; DL; DIV; NOSCRIPT; BLOCKQUOTE; FORM; HR; TABLE; FIELDSET; ADDRESS; Tekst; TT; I; B; BIG; SMALL; EM; STRONG; DFN; CODE; SAMP; KBD; VAR; CITE; ABBR; ACRONYM; A; IMG; OBJECT; BR; SCRIPT; MAP; Q; SUB; SUP; SPAN; BDO; INPUT; SELECT; TEXTAREA; LABEL; BUTTON

Toegestane attributen

id, class, style, title, dir, ondblclick, onmousedown, onmouseup, onmouseover, onmousemove, onmouseout, onkeypress, onkeydown, onkeyup, datasrc, datafld, dataformatas.