tabellen in HTML

Tabellen zijn niet alleen voor het (saaie) of ordelijk weergeven van gegevens, maar in het webdesign bovendien goed bruikbaar om elementen in een pagina te ordenen. Hieronder staat een eenvoudige opzet van een eerste tabel.

Om dit eens te zien de volgende pagina's:

eerste vak (in de eerste rij)	tweede vak (in de eerste rij)
derde vak (in de tweede rij)	vierde vak (in de tweede rij)

Hierboven staat de eerste tabel de code daarvoor luidt:

<table border="1">

<tr>
       <td>eerste vak<br>(in de eerste rij)</td>
       <td>tweede vak<br>(in de eerste rij)</td>
</tr>
<tr>
       <td>derde vak<br>(in de tweede rij)</td>
       <td>vierde vak<br>(in de tweede rij)</td>
</tr>
</table>

Kortom:

elk vak zit in een rij. Elk vak wordt door <td> en </td> omgeven. Zo kunnen er in elke rij meerdere vakken zitten.

In een tabel zit een of meerdere rijen. Elke rij bevat vakken en elke rij wordt door <tr> en </tr> omgeven.

Al deze rijen worden tenslotte omgeven door <table> en </table>

Hieronder nog enkele tabellen met gekleurde achtergrond en ruimte tussen de inhoud van de vakken:

eerste vak
(in de eerste rij) tweede vak
(in de eerste rij)

derde vak
(in de tweede rij) vierde vak
(in de tweede rij)

Hierboven staat een tabel met een gekleurde achtergrond en een tussenruimte tussen de vak-inhoud en de rand van 19 pixels. De code daarvoor luidt:

<table border="1" bgcolor="#9999FF" cellpadding="9">
<TR>
       <td>eerste vak<br>(in de eerste rij)</td>
       <td>tweede vak<br>(in de eerste rij)</td>
</tr>
<tr>
       <td>derde vak<br>(in de tweede rij)</td>
       <td>vierde vak<br>(in de tweede rij)</td>
</tr>
</table>

Hieronder nog enkele tabellen met gekleurde achtergrond en ruimte tussen de inhoud van de vakken:

eerste vak (in de eerste rij)	tweede vak (in de eerste rij)
derde vak (in de tweede rij)	vierde vak (in de tweede rij)

Hierboven staat een tabel met een gekleurde achtergrond. Dit gebeurt hier niet in de TABLE-tag, maar in de beide TR-tags. Er is een tussenruimte tussen de vak-inhoud en de rand van 15 pixels. De ruimte tussen de vakken is op 10 pixels gesteld. De code daarvoor luidt:

<table cellspacing="10" cellpadding="15" border="0">

<tr bgcolor="#9999FF">
       <td>eerste vak<br>(in de eerste rij)</td>
       <td>tweede vak<br>(in de eerste rij)</td>
</tr>
<tr bgcolor="#9999FF">
       <td>derde vak<br>(in de tweede rij)</td>
       <td>vierde vak<br>(in de tweede rij)</td>
</tr>
</table>

meer informatie over:

tabelmaten instellen

het samenvoegen van tabelcellen

tabellen in HTML

menu

links naar andere sites over HTML en CSS: