Handleiding HTML Inhoud HTML | Inhoud CSS | Trefwoordenregister | Begin

Inhoud onderdeel: Introductie tabellen | Eenvoudige tabellen | Samenvoegen cellen | Uitlijnen celinhoud | Uitlijnen tabel | Bijschrift bij tabel | Tabelranden | Achtergrond tabel | Rijgroepen | Kolomgroepen | Kader en lijnen | Voorrangsregels bij uitlijnen

Gerelateerde elementen: CAPTION | COL | COLGROUP | TABLE | TBODY | TD | TFOOT | TH | THEAD | TR

Achtergrond tabel

Het BGCOLOR attribuut van de elementen TABLE, TR, TD en TH kun je gebruiken om een achtergrondkleur vast te leggen voor de gehele tabel, de cellen in rij, of de afzonderlijke cellen.

In het volgende voorbeeld is met het BGCOLOR attribuut een achtergrondkleur voor het TABLE element bepaald. Deze achtergrondkleur wordt aangehouden voor de gehele tabel, dat wil zeggen zowel voor de cellen als voor de ruimte tussen de randen.

<TABLE BORDER="1" BGCOLOR="#FFFFCC">
<TR>
<TD WIDTH="120" HEIGHT="40">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:

Als je het BGCOLOR opneemt voor een TR element, dan kun je een achtergrondkleur voor de cellen in de betreffende rij vastleggen. De ruimte tussen de randen blijft daarbij transparant en in dit geval is daar de achtergrondkleur van het document te zien.

<TABLE BORDER="1">
<TR BGCOLOR="#FFCCCC">
<TD WIDTH="120" HEIGHT="40">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:

Wanneer je het BGCOLOR attribuut opneemt voor een TD (of TH) element, dan kun je de achtergrondkleur voor een enkele cel vastleggen.

<TABLE BORDER="1">
<TR>
<TD WIDTH="120" HEIGHT="40" BGCOLOR="#99FFCC">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:

Je kunt het BGCOLOR attribuut ook voor de verschillende elementen tegelijkertijd gebruiken. Welke kleur je te zien krijgt, wordt bepaald door de volgende regel: de achtergrondkleur van de cel heeft een hogere prioriteit dan die van de rij en de achtergrondkleur van de rij heeft een hogere prioriteit dan die van de tabel.

<TABLE BORDER="1" BGCOLOR="#FFFFCC">
<TR BGCOLOR="#FFCCCC">
<TD WIDTH="120" HEIGHT="40" BGCOLOR="#99FFCC">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:

Sommige browsers ondersteunen het BGCOLOR attribuut ook voor de elementen waarmee je rijgroepen en kolom(groep)en definieert. HTML 4.0 kent voor deze elementen echter geen BGCOLOR attribuut. Verder ondersteunen veel browser het BACKGROUND attribuut voor de elementen TABLE, TR, TD en TH. Ze bieden daarmee de mogelijkheid vast te leggen, dat een bepaalde afbeelding als achtergrond moet worden weergegeven. Ook dit is evenwel is strijd met HTML 4.0.
Wil je de mogelijkheid hebben een achtergrondkleur of -afbeelding vast te leggen voor alle elementen waaruit de tabel is opgebouwd, dan kun je het beste gebruik maken van stylesheets. Een uitgebreide toelichting wordt gegeven in het onderdeel CSS en tabellen - Achtergrond tabel.

Vervolg: Rijgroepen

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

Handleiding HTML (https://www.handleidinghtml.nl/)
Copyright © 1995-2024 Hans de Jong
Laatste wijziging: 5 december 2004