HTML-Dateien selbst erstellen
Dokumentation: HTML
Tabellen

Farbige Tabellen

 Hintergrundfarbe für gesamte Tabelle
 Hintergrundfarbe für einzelne Zeilen oder Zellen
 Farben für Rand und Gitternetzlinien
 Hintergrundbild (Wallpaper) für Tabelle oder Tabellenzellen

Hinweis:

Einige WWW-Browser, darunter die neueren Versionen von Netscape und MS Internet Explorer, unterstützen teilweise oder ganz die hier beschriebenen farbigen Tabellen. Farbige Tabellen gehören jedoch noch nicht zum HTML-Standard 3.2.

MS IE2.0Netscape3.0 Hintergrundfarbe für gesamte Tabelle

 Beispiel
Anzeigebeispiel: So sieht's aus

Sie können für alle Zellen einer Tabelle eine einheitliche Hintergundfarbe definieren.

Beispiel:

<table border bgcolor=#CCFFFF>
    <tr>
      <td>Zeile 1 Spalte 1 = hellblau
      <td>Zeile 1 Spalte 2 = hellblau
    </tr>
    <tr>
      <td>Zeile 2 Spalte 1 = hellblau
      <td>Zeile 2 Spalte 2 = hellblau
    </tr>
</table>

Erläuterung:

Durch die Angabe bgcolor= im einleitenden Tag der Tabelle können Sie eine Hintergrundfarbe für die gesamte Tabelle bestimmen (bgcolor = background color = Hintergrundfarbe). Beim Angeben der Farbe gelten die Regeln zum  Definieren von Farben in HTML.

Beachten Sie:

Wenn Sie eine Hintergrundfarbe definieren, sollten Sie für den Text eine geeignete Kontrastfarbe definieren. Falls Sie hierzu den HTML-Befehl zum Ändern von  Schriftfarben innerhalb des Textes verwenden wollen, müssen Sie diesen Befehl in jeder einzelnen Tabellenzelle erneut eingeben. Falls Ihre HTML-Datei im wesentlichen aus einer farbigen Tabelle besteht, sollten Sie geeignete  dateiweite Farben für Text und Verweise bestimmen.

MS IE2.0Netscape3.0 Hintergrundfarbe für einzelne Zeilen oder Zellen

Beispiel
Anzeigebeispiel: So sieht's aus

Sie können für eine Zeile oder eine einzelne Zelle innerhalb einer Tabelle eine Hintergrundfarbe definieren.

Beispiel:

<table border>
    <tr bgcolor=#CCFFFF>
      <td>Zeile 1 Spalte 1 = hellblau (gilt für Zeile)
      <td>Zeile 1 Spalte 2 = hellblau (gilt für Zeile)
    </tr>
    <tr bgcolor=#CCFFCC>
      <td bgcolor=#CCFFCC>Zeile 2 Spalte 1 = hellgrün (gilt für diese Zelle)
      <td bgcolor=#FFCCFF>Zeile 2 Spalte 2 = hellviolett (gilt für diese Zelle)
    </tr>
</table>

Erläuterung:

Durch die Angabe bgcolor= im einleitenden Tag einer Zeile (<tr>) können Sie eine Hintergrundfarbe für alle Zellen in dieser Zeile bestimmen (bgcolor = background color = Hintergrundfarbe). Wenn Sie bgcolor= im einleitenden Tag einer Datenzelle (<td>) oder Kopfzelle (<th>) angeben, gilt die Hintergrundfarbe für diese eine Zelle. Beim Angeben der Farbe gelten die Regeln zum  Definieren von Farben in HTML.

Beachten Sie:

Im Konfliktfall hat die Fabangabe in einzelnen Zellen Vorrang vor der Angabe für ganze Zeilen oder Tabellen. Die Angabe für eine Zeile hat im Konfliktfall Vorrang vor der Angabe für die ganze Tabelle.

Wenn Sie für eine Zelle eine Hintergrundfarbe definieren, sollten Sie für den Text einer Zelle eine geeignete Kontrastfarbe definieren. Hierzu können Sie den HTML-Befehl zum Ändern von  Schriftfarben verwenden.

MS IE2.0 Farben für Rand und Gitternetzlinien

Beispiel
Anzeigebeispiel: So sieht's aus

Sie können auch für Rahmen und Gitternetzlinien Farbangaben machen. Diese Angaben werden bislang jedoch nur vom MS Internet Explorer interpretiert.

Beispiel 1:

<table border bgcolor=#CCFFFF bordercolor=#000099>
    <tr>
      <td>Zeile 1 Spalte 1 = hellblau, Rahmen und Gitternetz dunkelblau
      <td>Zeile 1 Spalte 2 = hellblau, Rahmen und Gitternetz dunkelblau
    </tr>
    <tr>
      <td>Zeile 2 Spalte 1 = hellblau, Rahmen und Gitternetz dunkelblau
      <td>Zeile 2 Spalte 2 = hellblau, Rahmen und Gitternetz dunkelblau
    </tr>
</table>

Beispiel 2:

<table border=4 bgcolor=#CCFFCC bordercolordark=#660000 bordercolorlight=#FF0000>
    <tr>
      <td>Zeile 1 Spalte 1 = hellgrün, Rahmen und Gitternetz dunkelrot/rot
      <td>Zeile 1 Spalte 2 = hellgrün, Rahmen und Gitternetz dunkelrot/rot
    </tr>
    <tr>
      <td>Zeile 2 Spalte 1 = hellgrün, Rahmen und Gitternetz dunkelrot/rot
      <td>Zeile 2 Spalte 2 = hellgrün, Rahmen und Gitternetz dunkelrot/rot
    </tr>
</table>

Erläuterung:

Durch die Angabe bordercolor= im einleitenden Tag der Tabelle können Sie eine einheitliche Farbe für den Tabellenrahmen und die Gitternetzlinien bestimmen (bordercolor = Randfarbe).

Anstelle der einfachen Rahmenfarbe können Sie auch einen Schattier-Effekt in den Rahmen bringen, indem Sie zwei verschiedene Farben definieren - eine dunklere und eine hellere. Dazu notieren Sie im einleitenden Tag der Tabelle die beiden Zusatzangaben bordercolordark= (bordercolordark = dunkle Randfarbe) und bordercolorlight= (bordercolorlight = helle Randfarbe).

MS IE3.0 Hintergrundbild (Wallpaper) für Tabelle oder Tabellenzellen

Beispiel
Anzeigebeispiel: So sieht's aus

Sie können für eine Tabelle ein eigenes Hintergrundmuster (Wallpaper) definieren. Das funktioniert genauso wie bei  Hintergrundbildern (Wallpapers) für den gesamten Dateikörper.

Hintergrundbilder für Tabellen werden jedoch nur vom MS Internet Explorer interpretiert.

Beispiel:

<table border=4 background="datei.gif">
    <tr>
      <td background="datei2.gif">Zeile 1 Spalte 1
      <td>Zeile 1 Spalte 2
    </tr>
    <tr>
      <td background="datei2.gif">Zeile 2 Spalte 1
      <td>Zeile 2 Spalte 2
    </tr>
</table>

Erläuterung:

Durch die Angabe background= im einleitenden Tag der Tabelle können Sie ein Hintergrundbild für die gesamte Tabelle bestimmen (background = Hintergrund). Wenn Sie die Angabe im einleitenden Tag einer Tabellenzelle (<th> oder <td>)notieren, ist die Tabellenzelle der Bereich für das Hintergrundbild.

Beachten Sie:

Im Beispiel wird vorausgesetzt, daß sich die Grafikdatei im gleichen Verzeichnis befindet wie die HTML-Datei. Wenn die Grafik in einem anderen Verzeichnis steht, müssen Sie den relativen oder absoluten Pfadnamen angeben. Das funktioniert genau so wie beim  Einbinden von Grafiken.

Wenn Sie ein Hintergrundbild definieren, sollten Sie auch passende  Textvordergrundfarben definieren.

Inerhalb dieses Dokuments finden Sie im Abschnitt über typische Grafiksorten für WWW-Seiten ein paar  typische Hintergrundbilder.

Blättern:
Zellen verbinden     Tabellen beschriften und umgebender Text

HTML-Dateien selbst erstellen
Dokumentation: HTML
Tabellen

© 1997  Stefan Münz, s.muenz@euromail.com