Menu
Coddy logo textTech
JETZT LERNEN
flag De iconDeutschdown icon

Beschriftungen hinzufügen

Teil des Abschnitts Fundamentals 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. Beschriftungen werden mit dem <caption>-Tag erstellt, das unmittelbar nach dem <table>-Tag 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>
challenge icon

Aufgabe

Einfach

Erstellen Sie ein HTML-Dokument, das eine Tabelle mit einer Beschriftung enthält. Die Tabelle sollte die folgende Struktur haben:

  1. Ein <table>-Tag, um die Tabelle zu definieren.
  2. Ein <caption>-Tag mit dem Text "Product Inventory", um die Tabelle zu beschreiben.
  3. Eine Tabellenzeile (<tr>) für die Kopfzeile mit zwei Kopfzellen (<th>). Die Kopfzellen sollten "Product Name" und "Quantity" enthalten.
  4. Eine Tabellenzeile (<tr>) mit zwei Datenzellen (<td>). Die Zellen sollten "Laptop" und "5" enthalten.
  5. Eine weitere Tabellenzeile (<tr>) mit zwei Datenzellen (<td>). Die Zellen sollten "Mouse" und "10" enthalten.

Spickzettel

Das <caption>-Tag bietet einen Titel oder eine Erklärung für eine HTML-Tabelle. Es sollte unmittelbar nach dem <table>-Tag platziert werden.

<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>

Probier es selbst

<!DOCTYPE html>
<html>
    <body>
        <!-- Hier Code schreiben -->
    </body>
</html>
quiz iconTeste dich selbst

Diese Lektion enthält ein kurzes Quiz. Starte die Lektion, um es zu beantworten und deinen Fortschritt zu speichern.

Alle Lektionen in Fundamentals

1HTML-Grundlagen

Was ist HTML?Grundstruktur von HTMLTags und ElementeVerschachtelung und schließende TagsKommentare in HTML

4Rezeptkarte

ProjektübersichtRezepttitel und BeschreibungProjekt-LektionZutatenProjekt-LektionSchritteProjekt-Lektion

7Persönliche Profilseite

ProjektübersichtHeader-BereichProjekt-LektionProfilbildProjekt-LektionÜber-mich-BereichProjekt-LektionSocial LinksProjekt-Lektion

10Tabellen

Tabellen-GrundlagenBeschriftungen hinzufügenZeilen und Spalten verbindenZusammenfassung - Tabellen

2Text und Formatierung

ÜberschriftenAbsätzeZeilenumbrücheFetter und kursiver TextNochmals fett und kursivWiederholung – Formatierung

5Inhalte hinzufügen

HTML-AttributeLinksLinks zu neuen SeitenBilderBild-Attribute

8Formulare und Eingaben Teil 1

Formular-GrundlagenTexteingabenInput-AttributePasswortfeldLabels für EingabenZusammenfassung – Einfaches Formular

11Event-Registrierungsseite

ProjektübersichtHeader-BereichProjekt-LektionEvent-Details-BereichProjekt-LektionRegistrierungsformularProjekt-LektionFooter-BereichProjekt-Lektion

3Arbeiten mit Listen

Ungeordnete ListeGeordnete ListeVerschachtelte ListenZusammenfassung – Listen

6Seitenlayout

Bereiche (Divisions)Inline-SpansSemantische TagsSections und ArticlesZusammenfassung – Layout

9Formulare und Eingaben Teil 2

Radio-ButtonsCheckboxenDropdownsButtonsButtons in FormularenWiederholung - Formulare #1Wiederholung - Formulare #2

12Abschlussherausforderungen

Einfache ProfilkarteEvent-EinladungskarteEinfache ArtikelseiteLieblingsbücher-Liste