HTML5 Tag Referenz
Aus HTML5 Center
Inhaltsverzeichnis |
Einleitung
Dieser Artikel zeigt an Hand zweier Tabellen (gegliedert nach Struktur- und nach Inhaltselementen), die neuen Tags die HTML5 beinhaltet. Wenn Sie auf die einzelnen Elemente klicken, öffnen sich ausführlichere Einzelerklärungen mit Beispielcode, selbiges gilt für die einzelnen Attribute.
HTML5 Struktur-Elemente
Die folgenden Elemente dienen zur Strukturierung eines HTML Dokumentes.
| Tagname | Beschreibung | Zugelassene Attribute | Hinweis |
|---|---|---|---|
| <article> | Unabhängiger Absatz, mit Kontext zum Vorherigen (Beispiel: Kommentar zu etwas Gesagtem) | Globale Standardattribute Globale Ereignisattribute | - |
| <aside> | Inhalt, der zur Thematik passt, aber nicht direkt dazugehört (Beispiel: Querverweise) | Globale Standardattribute Globale Ereignisattribute | - |
| <details> | Inhalt, der nähere Informationen zu einem Text,Textteil oder einem anderen Inhalt bietet | Globale Standardattribute Globale Ereignisattribute | - |
| <figcaption> | Erlaubt es, dem <figure> Tag eine Bildunterschrit hinzuzufügen | Globale Standardattribute Globale Ereignisattribute | Sollte in dem <figure> Tag stehen auf den es sich bezieht |
| <figure> | Kennzeichnet Inhalt, der mit dem Thema zu tun hat, aber dessen Entfernung die Lesbarkeit des Dokumentes nicht beeinträchtigen würde (Beispiel: Quellcode) | Globale Standardattribute Globale Ereignisattribute | - |
| <footer> | Erlaubt es, Texten oder Teilen von Texten eine Fußnote hinzuzufügen (Beispiel: Einem Text den Autorennamen oder das Datum hinzufügen) | Globale Standardattribute Globale Ereignisattribute | - |
| <header> | Kennzeichnet die Einleitung eines Textes | Globale Standardattribute Globale Ereignisattribute | - |
| <hgroup> | Gruppiert die <h1> bis <h6> Tags | Globale Standardattribute Globale Ereignisattribute | Die <h1> bis <h6> Tags sollten im <hgroup> Element stehen |
| <mark> | Markiert einzelne Textpassagen gelb (Beispiel: Wichtige Namen besonders hervorheben) | Globale Standardattribute Globale Ereignisattribute | - |
| <nav> | Kennzeichnet die darin enthaltenen Elemente als Navigationselemente | Globale Standardattribute Globale Ereignisattribute | - |
| <section> | Kennzeichnet die einzelnen Sektionen eines Textes | Globale Standardattribute Globale Ereignisattribute cite | - |
| <summary> | Stellt die Überschrift innerhalb eines <details> Tags dar | Globale Standardattribute Globale Ereignisattribute | Sollte das erste Element in einem <details> Tag sein |
| <time> | Kennzeichnet Datums- oder Zeitangaben | Globale Standardattribute Globale Ereignisattribute datetime | - |
| <wbr> | Kennzeichnet die Stellen eines Wortes, an denen Zeilenumbrüche stattfinden können | Globale Standardattribute Globale Ereignisattribute | - |
HTML5 Inhalts-Elemente
Die folgenden Elemente dienen zum Hinzufügen von Inhalten, bzw. zur Darstellung von Daten.
| Tagname | Beschreibung | Zugelassene Attribute | Hinweis |
|---|---|---|---|
| <audio> | Dient zur Einbindung einer Audiodatei in ein HTML Dokument | Globale Standardattribute Globale Ereignisattribute autoplay controls end loop src start type | - |
| <canvas> | Das <canvas> Element ist dazu in der Lage, per HTML, Javascript-Zeichenoperationen durchzuführen | Globale Standardattribute Globale Ereignisattribute height width | Benötigt ein Script , um die auszugebende Grafik zu erstellen |
| <command> | Erlaubt es, folgende Eingabeelemente zu erstellen: Radiobutton, Checkboxen und normale Button | Globale Standardattribute Globale Ereignisattribute checked disabled icon label radiogroup type | Muss innerhalb eines <menu> Elementes stehen |
| <datalist> | Erlaubt es, dem User eine Auswahl an Antworten zu geben (Beispiel: Erstellen einer Umfrage) | Globale Standardattribute Globale Ereignisattribute | - |
| <embed> | Erlaubt die Einbindung weiterer Ressourcen, etwa die von Plug-Ins | Globale Standardattribute Globale Ereignisattribute height src type width | - |
| <keygen> | Erlaubt es, generierte Schlüssel zu definieren und per HTML zu übertragen | Globale Standardattribute Globale Ereignisattribute autofocus disabled form keytype name | - |
| <meter> | Erlaubt es, eine Messleiste darzustellen | Globale Standardattribute Globale Ereignisattribute high low max min optimum value | - |
| <output> | Erlaubt die Ausgabe von Werten, die Formulare errechnet haben (Beispiel: Der Preis der ausgewählten Artikel eines Online-Shops) | Globale Standardattribute Globale Ereignisattribute for form name | - |
| <progress> | Erlaubt die Anzeige eines Fortschrittbalkens | Globale Standardattribute Globale Ereignisattribute max value | - |
| <rp> | Definiert, was angezeigt werden soll, wenn der <ruby> Tag vom Browser nicht interpretiert wird | Globale Standardattribute Globale Ereignisattribute | Benötigt zwingend einen <ruby> Tag, in dem das Element steht |
| <rt> | Stellt Ausspracheanleitungen chinesischer Schriftzeichen dar und gibt chinesische Schriftzeichen selbst wieder | Globale Standardattribute Globale Ereignisattribute | Benötigt zwingend einen <ruby> Tag, in dem das Element steht |
| <ruby> | Leitet eine Folge von weiteren Ruby Tags (<rp> und <rt>) | Globale Standardattribute Globale Ereignisattribute | Stellt ohne ein <rp> oder <rt> Tag nichts dar |
| <source> | Kann die Quelle angeben die ein <audio> oder <video> Tag abspielen soll (Beispiel: Mehrere Dateien bereitstellen aus denen die Tags wählen, um zu verschiedenen Browsern kompatibel zu sein) | Globale Standardattribute Globale Ereignisattribute src type | Kann nichts ausgeben, wenn es nicht in einem <video> oder <audio> Tag steht |
| <video> | Erlaubt es, Videodateien in ein HTML Dokument einzubinden | Globale Standardattribute Globale Ereignisattribute autoplay controls height poster loop src width | - |
