Gestaltung von Tabellen

Die nachfolgend aufgeführten HTML-Anweisungen bieten Ihnen die Möglichkeit, das Aussehen der gesamten Tabelle zu bestimmen. Alle Attribute für die globale Tabellengestaltung werden im einleitenden <table>-Tag der Tabelle eingesetzt.

Attribute für das <table>-Tag

border="X"

- definiert einen Rahmen. Dem Attribut kann ein Wert zwischen 0 und 100 zugewiesen werden, der die Stärke nur für den äußeren Rahmen festlegt.

Beispiel:

cellspacing="X"

Bestimmt die Stärke (in Pixeln) der Gitternetzlinien zwischen den Zellen.

Beispiel:

cellpadding="X"

Bestimmt den Abstand des Zellinhaltes zum Zellenrand in Pixeln.

Beispiel:

width="X%" / width="X"

Legt die Breite der Tabelle fest. Die Werte können in Prozent (relativ zum Browser-Fenster, z.B. 90%) oder in Pixeln (als absoluter Wert, z.B. 500) angegeben werden.

Beispiel:

height="X%" / height="X"

Legt die Höhe der Tabelle fest. Die Werte können in Prozent (relativ zum Browser-Fenster, z.B. 90%) oder in Pixel (als absoluter Wert, z.B. 500) angegeben werden.

Beispiel:

bgcolor="#XXXXXX"

Definiert die Hintergrundfarbe der Tabelle.

Beispiel:

bordercolor="#XXXXXX"

Bestimmt die Farbe für den Rahmen und das Gitternetz.

Beispiel:

<table border="3" bordercolor="#0066CC"> Ansicht

background="Dateien"

Setzt ein Hintergrundbild ein.

Beispiel:

Übung

Aufgabe:

In dieser Übung werden die oben aufgeführten Attribute zur Tabellengestaltung eingesetzt. Legen Sie als erstes bitte eine neue HTML-Datei an. Bestimmen Sie anschließend das Aussehen der Tabelle indem Sie die folgenden HTML-Anweisungen einsetzen. - Die Tabelle soll aus 2 Spalten und 2 Zeilen bestehen. - Breite der Tabelle = 70% des Browser-Fensters. - Höhe der Tabelle = 80% des Browser-Fensters. - Rahmenstärke ="1".

Hier finden Sie die Lösung.

HTML lernen (2): Tabellen erstellen