Tabellen in HTML
Einfache Tabelle:
<table>
<tr>
<td>Inhalt</td>
</tr>
</table>
<table>
<table>
Leitet eine Tabelle ein (table = Tabelle)
<tr>
Leitet eine neue Tabellenzeile ein (tr = table row = Tabellenzeile)
Im Anschluss daran werden die Zellen (Spalten) der betreffenden Reihe definiert. Am Ende einer Tabellenzeile wird ein abschließendes Tag </tr> notiert.
<th>
<th> leitet eine Kopfzelle ein
th = table header = Tabellenkopf
<td>
Leitet eine normale Datenzelle (td = table data = Tabellendaten). Der Inhalt einer Zelle wird jeweils hinter dem Start-Tag notiert.
Beispieldatei
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Aufbau einer Tabelle</title>
<style>
table, td, th { border: 1px solid black; }
</style>
</head>
<body>
<h1>einfache Tabelle</h1>
<table>
<tr>
<th>Berlin</th>
<th>Hamburg</th>
<th>München</th>
</tr>
<tr>
<td>Miljöh</td>
<td>Kiez</td>
<td>Bierdampf</td>
</tr>
<tr>
<td>Buletten</td>
<td>Frikadellen</td>
<td>Fleischpflanzerl</td>
</tr>
</table>
</body>
</html>
Aufgabe
- Kopiere die Datei table.html und speichere sie in deinem Laufwerk
- Bearbeite die Tabelle und füge dein eigenes Inhalt hinzu
- Kopiere die fertige Datei in austausch_alle/Toufexis (vergiss deinen Namen nicht)