Beschriftungen hinzufügen
Teil des Abschnitts Grundlagen der HTML-Journey von Coddy. Lektion 49 von 60.
In HTML-Tabellen ist eine caption ein Titel oder eine Erklärung für die Tabelle. Sie bietet eine kurze Beschreibung des Tabelleninhalts und erleichtert es den Benutzern, den Zweck der Tabelle zu verstehen. Captions werden mit dem Tag <caption> erstellt, das unmittelbar nach dem Tag <table> platziert werden sollte.
Hier ist die grundlegende Syntax zum Hinzufügen einer Beschriftung zu einer Tabelle in HTML:
<table>
<caption>Table Caption</caption>
<tr>
<th>Header 1</th>
<th>Header 2</th>
</tr>
<tr>
<td>Row 1, Cell 1</td>
<td>Row 1, Cell 2</td>
</tr>
</table>
Aufgabe
EinfachErstelle ein HTML-Dokument, das eine Tabelle mit einer Beschriftung enthält. Die Tabelle sollte folgende Struktur haben:
- Ein
<table>-Tag zur Definition der Tabelle. - Ein
<caption>-Tag mit dem Text „Product Inventory“ zur Beschreibung der Tabelle. - Eine Tabellenzeile (
<tr>) für die Kopfzeile mit zwei Kopfzellen (<th>). Die Kopfzellen sollten „Product Name“ und „Quantity“ enthalten. - Eine Tabellenzeile (
<tr>) mit zwei Datenzellen (<td>). Die Zellen sollten „Laptop“ und „5“ enthalten. - Eine weitere Tabellenzeile (
<tr>) mit zwei Datenzellen (<td>). Die Zellen sollten „Mouse“ und „10“ enthalten.
Probier es selbst
<!DOCTYPE html>
<html>
<body>
<!-- Hier Code schreiben -->
</body>
</html>
Teste dich selbstDiese Lektion enthält ein kurzes Quiz. Starte die Lektion, um es zu beantworten und deinen Fortschritt zu speichern.
Alle Lektionen in Grundlagen
1HTML-Grundlagen
Was ist HTML?Grundstruktur von HTMLTags und ElementeVerschachtelung und schließende TagsKommentare in HTML10Tabellen
Tabellen-GrundlagenBeschriftungen hinzufügenZeilen und Spalten verbindenZusammenfassung - Tabellen2Text und Formatierung
ÜberschriftenAbsätzeZeilenumbrücheFetter und kursiver TextNochmals fett und kursivWiederholung – Formatierung8Formulare und Eingaben Teil 1
Formular-GrundlagenTexteingabenInput-AttributePasswortfeldLabels für EingabenZusammenfassung – Einfaches Formular11Event-Registrierungsseite
ProjektübersichtHeader-Bereich
Event-Details-BereichRegistrierungsformularFooter-Bereich6Seitenlayout
Bereiche (Divisions)Inline-SpansSemantische TagsSections und ArticlesZusammenfassung – Layout9Formulare und Eingaben Teil 2
Radio-ButtonsCheckboxenDropdownsButtonsButtons in FormularenWiederholung - Formulare #1Wiederholung - Formulare #212Abschlussherausforderungen
Einfache ProfilkarteEvent-EinladungskarteEinfache ArtikelseiteLieblingsbücher-ListeÜbe selbstständig: Web-Playground