Handleiding HTML - Tabellen

HTML		Tabellen

Handleiding HTML Inhoud HTML | Inhoud CSS | Trefwoordenregister | Begin

Uitlijnen tabel

Standaard wordt een tabel die niet de gehele breedte van het venster of frame beslaat, links uitgelijnd. Door gebruik te maken van het ALIGN attribuut van het TABLE element kun je zelf bepalen op welke wijze de tabel in horizontale richting wordt uitgelijnd.

Als je de tabel wilt centreren, dan gebruik je het ALIGN attribuut met de waarde "center".

<TABLE BORDER="1" ALIGN="center"> <TR> <TD WIDTH="120" HEIGHT="60">a1</TD> <TD WIDTH="80">a2</TD> </TR> <TR> <TD HEIGHT="40">b1</TD> <TD>b2</TD> </TR> </TABLE>

De browser geeft dit voorbeeld zo weer:

a1	a2
b1	b2

De waarden "left" en "right" zorgen er niet alleen voor dat de tabel links of rechts wordt uitgelijnd, ze hebben ook als resultaat dat de tabel "zwevend" wordt. De inhoud van het document die op de tabel volgt, wordt daardoor niet zoals gebruikelijk onder de tabel geplaatst, maar ernaast. In het volgende voorbeeld is dat te zien voor de waarde "left".

<TABLE BORDER="1" ALIGN="left"> <TR> <TD WIDTH="120" HEIGHT="60">a1</TD> <TD WIDTH="80">a2</TD> </TR> <TR> <TD HEIGHT="40">b1</TD> <TD>b2</TD> </TR> </TABLE>

<P>Met de waarde ... komt te staan.<BR CLEAR="all"></P>

De browser geeft dit voorbeeld zo weer:

a1	a2
b1	b2

Met de waarde "left" voor het ALIGN attribuut van het TABLE element maak je een links uitgelijnde "zwevende" tabel. De tekst wordt naast de tabel geplaatst en wanneer de hoeveelheid tekst groter is dan naast de tabel past, dan loopt de tekst onder de tabel door. Het is verstandig direct na de tekst het BR element met het CLEAR attribuut op te nemen. Daarmee voorkom je dat een volgende alinea onbedoeld ook weer naast in plaats van onder de tabel komt te staan.

De waarde "right" heeft een vergelijkbaar effect.

<TABLE BORDER="1" ALIGN="right"> <TR> <TD WIDTH="120" HEIGHT="60">a1</TD> <TD WIDTH="80">a2</TD> </TR> <TR> <TD HEIGHT="40">b1</TD> <TD>b2</TD> </TR> </TABLE>

<P>Als je de waarde ... geplaatst.<BR CLEAR="all"></P>

a1	a2
b1	b2

Als je de waarde "right" voor het ALIGN attribuut gebruikt, komt de tabel rechts in het venster te staan en wordt de tekst links naast de tabel geplaatst.

Wanneer je de tabel alleen rechts wil uitlijnen en hem niet "zwevend" wilt maken, dan kun je de hele tabel ook in een DIV element plaatsen en hiervoor het ALIGN attribuut gebruiken met de waarde "right".

<DIV ALIGN="right"><TABLE BORDER="1"> <TR> <TD WIDTH="120" HEIGHT="60">a1</TD> <TD WIDTH="80">a2</TD> </TR> <TR> <TD HEIGHT="40">b1</TD> <TD>b2</TD> </TR> </TABLE></DIV>

De browser geeft dit als volgt weer:

a1	a2
b1	b2

Het ALIGN attribuut van het TABLE element heeft in HTML 4.0 het label afgekeurd gekregen en hetzelfde geldt voor het ALIGN attribuut van het DIV element. Als alternatief kun je het uitlijnen van de tabel ook regelen met behulp van stylesheets. Zie hiervoor het onderdeel CSS en tabellen - Uitlijnen tabel.

Vervolg: Bijschrift bij tabel

Inhoud onderdeel | Inhoud HTML | Inhoud CSS | Trefwoordenregister | Begin