<html>
<head>
<title> Breite und Höhe von Tabellen</title>
</head>
<body>
<pre>Die kleinste Tabelle:</pre>
<table border="5">
<tr><td>Tabelle mit einer Zeile und einem Feld.</td></tr>
</table>
<pre>Zeilenumbruch verhindern:</pre>
<table border="5">
<tr><td nowrap="true">Der Zeilenumbruch wird durch den HTML-Attribut nowrap verhindert.</td></tr>
</table>
<pre>Header und leere Zellen:</pre>
<table border="2">
<tr>
<th>Vorname</th>
<th>Nachname</th>
</tr>
<tr>
<td>Herbert</td>
<td>König</td>
</tr>
<tr>
<td></td>
<td>Asterix</td>
</tr>
<tr>
<td> </td>
<td>Obelix</td>
</tr>
</table>
<pre>Breite einer Tabelle in Pixel:</pre>
<table border="2" width="1000">
<tr>
<td>Diese Tabelle hat eine fixe Breite von 1000 Pixel.</td>
</tr>
</table>
<pre>Breite einer Tabelle in Prozent:</pre>
<table border="2" width="100%">
<tr>
<td>Diese Tabelle hat eine fixe Breite von 100 %.</td>
</tr>
</table>
<pre>Breite der Spalten in Prozent:</pre>
<table border="2" width="75%">
<tr>
<td width="20%">20%</td>
<td width="*">Rest --> 30%</td>
<td width="50%">50%</td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
</tr>
</table>
<pre>Breite der Spalten in Pixel:</pre>
<table border="2" width="480">
<tr>
<td width="100">100 Pixel</td>
<td width="80">80 Pixel </td>
<td width="300">300 Pixel </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
</tr>
</table>
<pre>Höhe der Tabelle und der Zellen zeilenweise in Prozent:</pre>
<table border="2" align="center" height="90%">
<tr height="70%">
<th >Vorname</th>
<th>Nachname</th>
</tr>
<tr height="10%">
<td>Herbert</td>
<td>König</td>
</tr>
<tr height="10%">
<td> </td>
<td>Asterix</td>
</tr>
<tr height="*">
<td> </td>
<td>Obelix</td>
</tr>
</table>
<pre>Höhe der Tabelle und der Zellen zeilenweise in Pixel:</pre>
<table border="2" align="center" height="100">
<tr height="40">
<th >Vorname</th>
<th>Nachname</th>
</tr>
<tr height="20">
<td>Herbert</td>
<td>König</td>
</tr>
<tr height="20%">
<td> </td>
<td>Asterix</td>
</tr>
<tr height="*">
<td> </td>
<td>Obelix</td>
</tr>
</table>
<pre>Mit dem HTML-Tag colgroup in Pixel gruppierte Spalten: </pre>
<table border="2" width="200">
<colgroup>
<col width="100">
<col width="100">
</colgroup>
<tr>
<th>Vorname</th>
<th>Nachname</th>
</tr>
<tr>
<td>Herbert</td>
<td>König</td>
</table>
<pre>Mit dem HTML-Tag colgroup in Prozent gruppierte Spalten: </pre>
<table border="2" width="200">
<colgroup>
<col width="50%">
<col width="50%">
</colgroup>
<tr>
<th>Vorname</th>
<th>Nachname</th>
</tr>
<tr>
<td>Herbert</td>
<td>König</td>
</tr>
</table>
<pre>Mit dem HTML-Attribut span gruppierte Spalten: </pre>
<table border="2" width="100%">
<colgroup>
<col span ="3" width="10%">
<col span ="2" width="35%">
</colgroup>
<tr>
<td>Zelle 1</td>
<td>Zelle 2</td>
<td>Zelle 3</td>
<td>Zelle 4</td>
<td>Zelle 5</td>
</tr>
<tr>
<td>10 %</td>
<td>10 %</td>
<td>10 %</td>
<td>35 %</td>
<td>35 %</td>
</tr>
</table>
<br>
</body>
</html>