Hier sind fünf einfach umsetzbare Übungen, die das Arbeiten mit <thead>, <tbody> und <tfoot> üben. Jede Aufgabe beinhaltet eine Lösung mit einem kurzen HTML-Code.

Aufgabe 1: Artikelkatalog

Erstelle eine Tabelle mit <thead>, <tbody> und <tfoot>, die folgende Informationen darstellt:

• Kopf: Artikel, Preis, Lagerbestand
• Daten: Buch (15 €, 20 Stück), Stift (2 €, 50 Stück), Block (5 €, 100 Stück)
• Fuß: Ein Hinweis: „Alle Preise inkl. Mehrwertsteuer.“

Lösung:

<table>
  <thead>
    <tr>
      <th>Artikel</th>
      <th>Preis</th>
      <th>Lagerbestand</th>
    </tr>
  </thead>
<tfoot>
    <tr>
      <td colspan="3">Alle Preise inkl. Mehrwertsteuer.</td>
    </tr>
  </tfoot>
  <tbody>
    <tr>
      <td>Buch</td>
      <td>15 €</td>
      <td>20</td>
    </tr>
    <tr>
      <td>Stift</td>
      <td>2 €</td>
      <td>50</td>
    </tr>
    <tr>
      <td>Block</td>
      <td>5 €</td>
      <td>100</td>
    </tr>
  </tbody>
</table>

Aufgabe 2: Umsatzübersicht

• Kopf: Produkt, Verkaufte Stücke, Umsatz
• Körper: Laptop (5, 5000 €), Maus (10, 200 €)
• Fuß: Gesamteinnahmen: 5200 €.

Lösung:

<table>
  <thead>
    <tr>
      <th>Produkt</th>
      <th>Verkaufte Stücke</th>
      <th>Umsatz</th>
    </tr>
  </thead>
<tfoot>
    <tr>
      <td colspan="2">Gesamteinnahmen</td>
      <td>5200 €</td>
    </tr>
  </tfoot>
  <tbody>
    <tr>
      <td>Laptop</td>
      <td>5</td>
      <td>5000 €</td>
    </tr>
    <tr>
      <td>Maus</td>
      <td>10</td>
      <td>200 €</td>
    </tr>
  </tbody>
</table>

Die weiteren Aufgaben können ähnlich gestaltet werden – z. B. größere Rechnungsübersichten, Rabatt-Aktionen oder Kategorienlisten. Der Fokus liegt immer darauf, <thead>, <tbody> und <tfoot> sinnvoll einzusetzen!