Tabellen mit HTML

Damit Inhalte auf einer Seite übersichtlicher dargestellt werden, ist manchmal sinnvoll, diese in Form einer Tabelle anzulegen.

Tabellen haben den folgenden Grundaufbau:

<table width="200" border="1" cellpadding="0" cellspacing="0">
<tr>
<th>Titel 1 </th>
<th>Titel 2 </th>
</tr>
<tr>
<td>Inhalt 1 </td>
<td>Inhalt 2 </td>
</tr>
<tr>
<td>Inhalt 3 </td>
<td>Inhalt 4 </td>
</tr>
</table>

In der ersten Zeile wird die Breite (width) der Tabelle mit 200 Pixeln festgelegt und der Rahmen auf die Breite 1 Pixel gesetzt. Der Abstand zwischen den Zellen (cellspacing) ist 0 Pixel und es gibt keine Zellausfüllung (cellpadding="0").

Danach erfolgt zeilenweise der Aufbau der Tabelle.

Tag	Wirkung
<tr>	Beginn einer neuen Zeile
<th>	Diese Zelle ist eine Überschrift
<td>	Tabellenzelle

Wichtig ist, dass in jeder Zeile die selbe Anzahl von Zellen vorhanden ist.

 

Aufgabe

1. Lege eine Datei: tabelle.htm an. Erstelle dabei die folgende Tabelle (die Breite ist 300 Pixel):
   
   

   Attribut	Wirkung
   width="200"	Breite ist 200 Pixel
   border="1"	1 Pixel breiter Rand

2. Teste, welche Veränderungen die Änderung der Werte für cellpadding und cellspacing bewirken!

Das sieht dann so aus:

Titel 1	Titel 2
Inhalt 1	Inhalt 2
Inhalt 3	Inhalt 4