Diese Seite ist ein schnelles Nachschlageregister der HTML-Tags, nach Verwendungszweck gruppiert: grundlegende Struktur, Textformatierung, Formulare, Tabellen, Medien, Semantik, Metadaten und Skripting. Jede Zeile verweist auf ein vollständiges Kapitel mit Beispielen, Attributen und Browser-Unterstützung. Nutzen Sie die Seite, um zu ermitteln, was ein Tag tut und wohin er gehört, und folgen Sie dann dem Link für die Details.
In der Tabelle erscheinen zwei Markierungen:
- (HTML5) — das Element wurde in HTML5 eingeführt. Es ist Teil des aktuellen Standards und sicher in modernen Browsern verwendbar.
- (Obsolete) — das Element wurde aus dem HTML-Standard entfernt. Browser können es aus Gründen der Abwärtskompatibilität noch darstellen, aber Sie sollten es nicht in neuem Code verwenden. Die empfohlene Alternative ist in der Beschreibung angegeben. Siehe Veraltete HTML-Tags für die vollständige Liste und moderne Alternativen.
Die meisten Tags kommen paarweise vor — ein öffnendes Tag wie <p> und ein schließendes Tag </p>, die ihren Inhalt einschließen. Einige wenige (zum Beispiel <br>, <hr> und <img>) sind void-Elemente ohne schließendes Tag. Einen tieferen Einblick darin, wie Tags, Elemente und Attribute zusammenpassen, finden Sie unter HTML-Elemente und HTML-Attribute.
| Tag | Beschreibung |
|---|
<!DOCTYPE> | Legt den Dokumenttyp fest. |
<html> | Definiert ein HTML-Dokument. |
<head> | Enthält allgemeine Informationen (Metadaten) über das Dokument. |
<title> | Legt den Titel des Dokuments fest. |
<body> | Gibt den Hauptteil des Dokuments an. |
<h1> to <h6> | Definiert HTML-Überschriften. |
<p> | Definiert einen Absatz. |
<br> | Gibt einen Zeilenumbruch an. |
<hr> | Fügt eine horizontale Linie ein oder definiert einen thematischen Trenner. |
| <!-- ... --> | Definiert einen Kommentar. |
Formatierungs-Tags kennzeichnen die Bedeutung oder das Erscheinungsbild von Textfragmenten. Viele ältere präsentationale Tags hier sind (Obsolete) — verwenden Sie stattdessen CSS für visuelle Gestaltung.
| Tag | Beschreibung |
|---|
<abbr> | Definiert eine Abkürzung oder ein Akronym. |
<acronym> | (Obsolete) Definiert ein Akronym. Verwenden Sie stattdessen <abbr>. |
<address> | Gibt Kontaktinformationen für den Autor/Eigentümer eines Dokuments oder Artikels an. |
<b> | Zeigt Text in Fettschrift an. |
<bdi> | (HTML5) Isoliert ein Textfragment von seiner Umgebung für die bidirektionale Textformatierung. |
<bdo> | Überschreibt die aktuelle Textrichtung. |
<big> | (Obsolete) Zeigt Text in größerer Schrift an. Verwenden Sie stattdessen CSS. |
<blockquote> | Definiert ein langes (Block-Level-)Zitat. |
<center> | (Obsolete) Stellt Inhalte zentriert dar. Verwenden Sie stattdessen CSS. |
<cite> | Markiert einen Verweis (Titel, Autor oder URL) auf ein zitiertes kreatives Werk. |
<code> | Definiert ein Fragment von Computercode. |
<del> | Gibt gelöschten Text an. |
<dfn> | Markiert die definierende Instanz eines Begriffs. |
<em> | Gibt betonten Text an. |
<font> | (Obsolete) Legt Schriftart, Farbe und Größe des Textes fest. Verwenden Sie stattdessen CSS. |
<i> | Zeigt Text kursiv an. |
<ins> | Definiert in ein Dokument eingefügten Text. |
<kbd> | Gibt Tastatureingaben an. |
<mark> | (HTML5) Markiert/hebt Text hervor. |
<meter> | (HTML5) Definiert eine skalare Messung innerhalb eines bekannten Bereichs (eine Anzeige). |
<pre> | Definiert vorformatierten Text. |
<progress> | (HTML5) Zeigt den Abschlussfortschritt einer Aufgabe an (Fortschrittsbalken). |
<q> | Definiert ein kurzes, inline-Zitat. |
<rp> | (HTML5) Stellt Fallback-Klammern für Browser bereit, die keine Ruby-Annotationen unterstützen. |
<rt> | (HTML5) Definiert die Aussprache von Zeichen in einer Ruby-Annotation (für ostasiatische Typografie). |
<ruby> | (HTML5) Stellt eine Ruby-Annotation dar (für ostasiatische Typografie). |
<s> | Zeigt Text, der nicht mehr aktuell ist, im Durchstreichungsstil an. |
<samp> | Legt die Beispielausgabe eines Computerprogramms fest. |
<small> | Zeigt Text in kleinerer Schrift an (Randnotizen, Kleingedrucktes). |
<strike> | (Obsolete) Definiert durchgestrichenen Text. Verwenden Sie stattdessen <del> oder <s>. |
<strong> | Definiert Text von großer Bedeutung. |
<sub> | Definiert tiefgestellten Text. |
<sup> | Definiert hochgestellten Text. |
<time> | (HTML5) Definiert ein Datum/eine Uhrzeit. |
<tt> | (Obsolete) Zeigt Text in Schreibmaschinen-(Monospace-)Stil an. Verwenden Sie stattdessen CSS. |
<u> | Rendert Text mit einer nicht-textuellen Annotation, standardmäßig unterstrichen dargestellt. |
<var> | Definiert eine Variable. |
<wbr> | (HTML5) Definiert eine mögliche Zeilenumbruch-Möglichkeit. |
| Tag | Beschreibung |
|---|
<form> | Gibt ein HTML-Formular für Benutzereingaben an. |
<input> | Definiert ein Eingabe-Steuerelement. |
<textarea> | Legt ein mehrzeiliges Texteingabe-Steuerelement (Textbereich) fest. |
<button> | Definiert eine anklickbare Schaltfläche innerhalb eines HTML-Formulars. |
<select> | Definiert eine Auswahlliste innerhalb eines Formulars. |
<optgroup> | Gruppiert verwandte Optionen in einer Auswahlliste. |
<option> | Definiert eine Option in einer Auswahlliste. |
<label> | Legt eine Beschriftung für ein <input>-Element fest. |
<fieldset> | Gruppiert verwandte Elemente in einem Formular. |
<legend> | Legt einen Titel für ein <fieldset>-Element fest. |
<datalist> | (HTML5) Enthält einen Satz vordefinierter Optionen für ein <input>-Element. |
<keygen> | (Obsolete) Generierte ein Schlüsselpaar für die Formularübermittlung. Aus dem Standard entfernt; kein direkter Ersatz. |
<output> | (HTML5) Definiert das Ergebnis einer Berechnung. |
Framesets teilen das Browserfenster in unabhängige Dokumente auf. Sie sind (Obsolete) in HTML5 — verwenden Sie stattdessen <iframe> oder CSS-Layout.
| Tag | Beschreibung |
|---|
<frame> | (Obsolete) Gibt einen einzelnen Frame innerhalb eines Framesets an. |
<frameset> | (Obsolete) Gibt einen Satz von Frames an. |
<noframes> | (Obsolete) Stellt alternativen Inhalt für Browser bereit, die keine Frames unterstützen. |
<iframe> | Bettet ein anderes Dokument in einem Inline-Frame ein. |
| Tag | Beschreibung |
|---|
<img> | Gibt ein Bild an. |
<map> | Gibt eine clientseitige Image-Map an. |
<area> | Definiert einen interaktiven Bereich innerhalb einer Image-Map. |
<canvas> | (HTML5) Eine Zeichenfläche zum dynamischen Rendern von Grafiken per Skripting (normalerweise JavaScript). |
<figcaption> | (HTML5) Definiert eine Bildunterschrift für ein <figure>-Element. |
<figure> | (HTML5) Definiert eigenständigen Inhalt, wie eine Illustration oder ein Diagramm. |
<picture> | (HTML5) Container für mehrere Bildressourcen, die in <source>-Elementen angegeben sind. |
<svg> | (HTML5) Container für inline SVG-Grafiken. |
| Tag | Beschreibung |
|---|
<audio> | (HTML5) Bettet Audioinhalte ein. |
<source> | (HTML5) Gibt alternative Medienressourcen für <video>, <audio> oder <picture> an. |
<track> | (HTML5) Fügt eine Textspur (Untertitel, Beschriftungen) für <video> und <audio> hinzu. |
<video> | (HTML5) Bettet Videoinhalte ein. |
| Tag | Beschreibung |
|---|
<a> | Definiert einen Hyperlink. |
<link> | Verknüpft das aktuelle Dokument mit einer externen Ressource (üblicherweise ein externes CSS-Stylesheet). |
<nav> | (HTML5) Definiert einen Block mit Navigationslinks. |
| Tag | Beschreibung |
|---|
<ul> | Definiert eine ungeordnete Liste. |
<ol> | Definiert eine geordnete Liste. |
<li> | Definiert ein Listenelement. |
<dir> | (Obsolete) Definiert eine Verzeichnisliste. Verwenden Sie stattdessen <ul>. |
<dl> | Definiert eine Beschreibungsliste (Definitionsliste). |
<dt> | Definiert einen Begriff/Namen in einer Beschreibungsliste. |
<dd> | Definiert die Beschreibung für einen Begriff in einer Beschreibungsliste. |
<menu> | Definiert eine Liste (Menü) von Befehlen. |
<menuitem> | (Obsolete) Definierte einen Befehl in einem Kontextmenü. Aus dem Standard entfernt und in modernen Browsern nicht unterstützt. |
| Tag | Beschreibung |
|---|
<table> | Definiert eine Tabelle. |
<caption> | Definiert einen Titel der Tabelle. |
<th> | Definiert eine Kopfzelle in einer Tabelle. |
<tr> | Definiert eine Zeile von Zellen in einer Tabelle. |
<td> | Definiert eine Zelle in einer Tabelle. |
<thead> | Gruppiert einen Satz von Zeilen, der die Spaltenbezeichnungen einer Tabelle beschreibt. |
<tbody> | Gruppiert einen Satz von Zeilen, der den Hauptteil der Tabellendaten definiert. |
<tfoot> | Definiert eine Fußzeile einer Tabelle. |
<col> | Definiert Werte für eine oder mehrere Spalten in einem <colgroup>-Element. |
<colgroup> | Gibt eine Gruppe von einer oder mehreren Spalten in einer Tabelle zur Formatierung an. |
Diese Tags tragen keine inhärente Bedeutung. Sie sind Container, die Sie mit CSS gestalten. Greifen Sie auf sie nur zurück, wenn kein semantisches Element passt.
| Tag | Beschreibung |
|---|
<div> | Definiert einen generischen Block-Level-Container. |
<span> | Definiert einen generischen Inline-Container. |
<style> | Enthält Stilinformationen (üblicherweise CSS) für das Dokument. |
Semantische Elemente beschreiben die Bedeutung ihres Inhalts und helfen Browsern, Suchmaschinen und unterstützenden Technologien. Siehe Semantische Elemente in HTML5.
| Tag | Beschreibung |
|---|
<header> | (HTML5) Definiert einen Header oder einen Block mit einleitendem Inhalt. |
<footer> | (HTML5) Definiert eine Fußzeile für ein Dokument oder einen Abschnitt. |
<main> | (HTML5) Gibt den dominanten Inhalt des Dokuments an. |
<section> | (HTML5) Definiert eine thematische Gruppierung von Inhalten. |
<article> | (HTML5) Definiert eigenständigen, unabhängig verteilbaren Inhalt. |
<aside> | (HTML5) Definiert Inhalte, die in losem Bezug zum umgebenden Inhalt stehen. |
<details> | (HTML5) Ein Aufklappelement, das der Benutzer öffnen oder schließen kann. |
<summary> | (HTML5) Definiert die sichtbare Überschrift für ein <details>-Element. |
<dialog> | (HTML5) Definiert ein Dialogfeld oder ein modales Fenster. |
<data> | (HTML5) Verknüpft Inhalt mit einem maschinenlesbaren Wert. |
| Tag | Beschreibung |
|---|
<head> | Enthält Metadaten über das Dokument, die dem Benutzer nicht angezeigt werden. |
<meta> | Definiert Metadaten wie Zeichensatz, viewport und Beschreibung. |
<base> | Definiert die Basis-URL und/oder das Ziel für alle relativen Links auf einer Seite. |
<basefont> | (Obsolete) Legte eine Standardschriftart, -größe und -farbe fest. Verwenden Sie stattdessen CSS. |
<template> | (HTML5) Enthält inaktives Markup, das nicht gerendert wird, aber mit JavaScript geklont und eingefügt werden kann. |
| Tag | Beschreibung |
|---|
<script> | Bettet ausführbares Skript ein oder referenziert es (normalerweise JavaScript). |
<noscript> | Definiert Fallback-Inhalte für Browser mit deaktiviertem oder nicht unterstütztem Skripting. |
<embed> | Bettet externen Inhalt (wie ein Plug-in oder Medien) an der angegebenen Stelle ein. |
<object> | Bettet eine externe Ressource ein (Bild, verschachtelter Browsing-Kontext, Plug-in-Inhalt). |
<param> | Definiert einen Parameter für ein <object>-Element. |
<applet> | (Obsolete) Bettete ein Java-Applet ein. Aus dem Standard entfernt; verwenden Sie stattdessen <object> oder <embed>. |
Übung