Attributen
Dit element bevat de globale attributen.
Opmerking
Het align-attribuut is verouderd; gebruik het niet meer. Gebruik in plaats daarvan CSS-eigenschappen of technieken zoals CSS Grid of CSS Flexbox om <div>-elementen op de pagina uit te lijnen en te positioneren.
Gebruiksaanwijzingen
- Het
<div>-element mag alleen worden gebruikt wanneer geen ander semantisch element (zoals<article>of<nav>) geschikt is.
Toegankelijkheid
Het <div>-element heeft een impliciete rol van generic, en niet none. Dit kan invloed hebben op bepaalde combinaties van ARIA-declaraties die verwachten dat een direct onderliggend element een bepaalde rol heeft om correct te functioneren.
Voorbeelden
Een eenvoudig voorbeeld
HTML
<div>
<p>
Any kind of content here. Such as <p>, <table>. You name it!
</p>
</div>Resultaat
Resultaat in de browser
Een gestyled voorbeeld
Dit voorbeeld creëert een schaduwvak door met CSS een stijl toe te passen op de <div>. Merk op dat het class-attribuut op de <div> wordt gebruikt om de stijl met de naam "shadowbox" op het element toe te passen.
HTML
HTML
<div class="shadowbox">
<p>Here's a very interesting note displayed in a lovely shadowed box.</p>
</div>CSS
CSS
.shadowbox {
width: 15em;
border: 1px solid #333333;
box-shadow: 8px 8px 5px #444444;
padding: 8px 12px;
background-image: linear-gradient(180deg, white, #dddddd 40%, #cccccc);
}Resultaat
Resultaat in de browser
Technische samenvatting
| Inhoudscategorieën | Flow content, tastbare content (palpable content). |
|---|---|
| Toegestane inhoud |
Flow content. Of (in WHATWG HTML): Als de ouder een <dl>-element is: een of meer
<dt>-elementen gevolgd door een of meer
<dd>-elementen, eventueel afgewisseld met
<script>- en
<template>-elementen.
|
| Weglaten van tags | Geen, zowel de begin- als de eindtag zijn verplicht. |
| Toegestane ouders |
Elk element dat
flow content
accepteert. Of (in WHATWG HTML): het <dl>-element.
|
| Impliciete ARIA-rol |
generic
|
| Toegestane ARIA-rollen | Elke |
| DOM-interface | HTMLDivElement |