|
HTML Tabellen
|
Einführung in HTML-Tabellen
In diesem kompakten Tutorial möchten wir Sie in die Welt der HTML-Tabellen einführen.
Durch diese Tabellen besteht die Möglichkeit, Elemente auf einer Webseite nach eigenen Wünschen anzuordnen.
Man kann auch klassische Tabellen im Stile einer Tabellenkalkulation (z. B. für Rechenaufgaben) erstellen.
Um den Effekt einer Frame-Seite nachzuahmen werden Tabellen besonders gerne genutzt.
Der Aufbau einer Tablle ist immer gleich. Sie besteht aus Zeilen (waagerecht), Spalten (senkrecht) und Zellen
(Schnittpunkte von Zeilen und Spalten). Der folgende Workshop vermittelt Ihnen, wie man Tabellen in
HTML erstellen und sie anschließend für die eigene Webseite optimieren kann.
|
Beispiel Nr. 1
| ZEILE 1 SPALTE 1 |
ZEILE 1 SPALTE 2 |
| ZEILE 2 SPALTE 1 |
ZEILE 2 SPALTE 2 |
Code:
<table border="1">
<tr>
<td> ZEILE 1 SPALTE 1</td>
<td> ZEILE 1 SPALTE 2</td>v;
</tr>
<tr>
<td> ZEILE 2 SPALTE 1</td>
<td> ZEILE 2 SPALTE 2</td>
</tr>
</table>
|
Der Anfang einer Tabelle beginnt immer mit dem Befehl <table>. Geschlossen wird die Tabelle mit dem Befehl </table>.
Der Befehl table enthält dabei auch das Attribut border. Der Wert border, ist für die Dicke des Rahmens, der Grenze der Tabelle zuständig.
Beim Wert gleich Null, wird die Tabelle ohne Rahmen angezeigt.
Mit dem Wert 10 wird der Rahmen sehr dick. Testen Sie es einmal!
Weiterhin taucht der Befehl tr in unserem Beispiel auf.
Mit jedem tr-Befehl kommt eine Zeile dazu.
Innerhalb des tr-Befehls befinden sich oben zwei td-Befehle, die auch jeweils geschlossen werden bevor der tr-Befehl geschlossen wird.
Diese td-Befehle werden für Spalten innerhalb der Zeile eingesetzt.
Als Resultat erhalten wir eine Zeile mit zwei Spalten.
Die o. g. Befehle wiederholen sich und wir erhalten wie gewünscht 2 Zeilen mit jeweils 2 Spalten.
|
weiter
|
