Inhaltskategorien
Die meisten HTML-Elemente gehören zu einer oder mehreren Inhaltskategorien — diese Kategorien gruppieren Elemente, die gemeinsame Merkmale teilen. Dies ist eine lose Gruppierung (sie schafft tatsächlich keine Beziehung zwischen Elementen dieser Kategorien), aber sie helfen dabei, das gemeinsame Verhalten der Kategorien und ihre zugehörigen Regeln zu definieren und zu beschreiben. Es ist möglich, dass Elemente (wie zum Beispiel <track>
) Mitglied keiner dieser Kategorien sind.
Die Inhaltskategorien werden verwendet, um das Inhaltsmodell von Elementen zu definieren, also was jedes Element als Nachfahren haben kann. Zum Beispiel kann ein <p>
-Element nur Phraseninhalt enthalten, während ein <div>
-Element Flussinhalt enthalten kann.
Es gibt sieben Hauptinhaltskategorien, die mit dem folgenden Venn-Diagramm zusammengefasst werden können:
Hinweis: Eine detailliertere Diskussion dieser Inhaltskategorien und ihrer vergleichbaren Funktionen liegt außerhalb des Rahmens dieses Artikels; dafür möchten Sie vielleicht die relevanten Teile der HTML-Spezifikation lesen.
Metadaten-Inhalt
Elemente, die zur Kategorie Metadaten-Inhalt gehören, ändern die Präsentation oder das Verhalten des restlichen Dokuments, richten Links zu anderen Dokumenten ein oder vermitteln andere übergeordnete Informationen. Alles im <head>
, einschließlich des <title>
, <link>
, <script>
, <style>
und des weniger verwendeten <base>
, ist Metadaten-Inhalt. Es gibt ein <meta>
-Element für Metadaten, die nicht durch diese anderen Elemente dargestellt werden können.
Die Metadaten-Elemente sind:
Einige dieser Elemente gehören zu mehr als einer Inhaltskategorie. Zum Beispiel ist <script>
ein Mitglied der Metadaten-, Fluss- und Phraseninhaltskategorien und ist ein skriptunterstützendes Element; <script>
kann dort verwendet werden, wo Metadaten-Inhalte, Phrasen-Inhalte oder skriptunterstützende Elemente erwartet werden.
Flussinhalt
Flussinhalt ist eine breite Kategorie, die die meisten Elemente umfasst, die innerhalb des <body>
-Elements platziert werden können, einschließlich Überschriftselemente, Abschnittselemente, Phrasenelemente, Einbettungselemente, interaktive Elemente und formularbezogene Elemente. Sie umfasst auch Textknoten (aber nicht diejenigen, die nur aus Leerzeichen bestehen).
Die Flusselemente sind:
<a>
<abbr>
<address>
<article>
<aside>
<audio>
<b>
<bdi>
<bdo>
<blockquote>
<br>
<button>
<canvas>
<cite>
<code>
<data>
<datalist>
<del>
<details>
<dfn>
<dialog>
<div>
<dl>
<em>
<embed>
<fieldset>
<figure>
<footer>
<form>
<h1>
-<h6>
<header>
<hgroup>
<hr>
<i>
<iframe>
<img>
<input>
<ins>
<kbd>
<label>
<main>
<map>
<mark>
<math>
<menu>
<meter>
<nav>
<noscript>
<object>
<ol>
<output>
<p>
<picture>
<pre>
<progress>
<q>
<ruby>
<s>
<samp>
<script>
<search>
<section>
<select>
<slot>
<small>
<span>
<strong>
<sub>
<sup>
<svg>
<table>
<template>
<textarea>
<time>
<u>
<ul>
<var>
<video>
<wbr>
- Autonome benutzerdefinierte Elemente
- Klartext
Einige andere Elemente gehören zu dieser Kategorie, aber nur, wenn eine bestimmte Bedingung erfüllt ist:
Abschnittsinhalte
Überschrifteninhalt
Überschrifteninhalt, eine Unterkategorie von Flussinhalten, definiert den Titel eines Abschnitts. Diese Definition gilt sowohl für Abschnitte, die durch ein explizites Abschnittsinhaltelement markiert sind, als auch für diejenigen, die implizit durch den Überschrifteninhalt selbst definiert sind.
Die Überschriftenelemente sind:
Hinweis:
Obwohl wahrscheinlich Überschrifteninhalt enthalten ist, ist das <header>
nicht selbst ein Überschrifteninhalt.
Phraseninhalt
Phraseninhalt, eine Unterkategorie von Flussinhalten, bezieht sich auf den Text und das Markup innerhalb eines Dokuments. Sequenzen von Phraseninhalt bilden Absätze.
Die Phrasenelemente sind:
<abbr>
<audio>
<b>
<bdi>
<bdo>
<br>
<button>
<canvas>
<cite>
<code>
<data>
<datalist>
<dfn>
<em>
<embed>
<i>
<iframe>
<img>
<input>
<kbd>
<label>
<mark>
<math>
<meter>
<noscript>
<object>
<output>
<picture>
<progress>
<q>
<ruby>
<s>
<samp>
<script>
<select>
<slot>
<small>
<span>
<strong>
<sub>
<sup>
<svg>
<template>
<textarea>
<time>
<u>
<var>
<video>
<wbr>
- Autonome benutzerdefinierte Elemente
- Klartext
Einige andere Elemente gehören zu dieser Kategorie, aber nur, wenn eine bestimmte Bedingung erfüllt ist:
<a>
, wenn es nur Phraseninhalt enthält<area>
, wenn es ein Nachkomme eines<map>
-Elements ist<del>
, wenn es nur Phraseninhalt enthält<ins>
, wenn es nur Phraseninhalt enthält<link>
, wenn dasitemprop
-Attribut vorhanden ist<map>
, wenn es nur Phraseninhalt enthält<meta>
, wenn dasitemprop
-Attribut vorhanden ist
Eingebetteter Inhalt
Eingebetteter Inhalt, eine Unterkategorie von Flussinhalten, importiert eine andere Ressource oder fügt Inhalt aus einer anderen Markup-Sprache oder einem anderen Namensraum in das Dokument ein.
Die eingebetteten Inhaltelemente sind:
Interaktiver Inhalt
Interaktiver Inhalt, eine Unterkategorie von Flussinhalten, umfasst Elemente, die speziell für die Benutzerinteraktion entwickelt wurden.
Die interaktiven Inhaltelemente sind:
Einige Elemente gehören zu dieser Kategorie nur unter bestimmten Bedingungen:
<a>
, wenn dashref
-Attribut vorhanden ist<audio>
, wenn dascontrols
-Attribut vorhanden ist<img>
, wenn dasusemap
-Attribut vorhanden ist<input>
, wenn dastype
-Attribut nicht im versteckten Zustand ist<object>
, wenn dasusemap
-Attribut vorhanden ist<video>
, wenn dascontrols
-Attribut vorhanden ist
Greifbarer Inhalt
Greifbarer Inhalt ist Inhalt, der weder leer noch verborgen ist; es ist Inhalt, der gerendert und substanziell ist. Greifbarer Inhalt wird nicht zur Definition von Inhaltsmodellen verwendet, sondern zur Definition einer allgemeinen Regel: Elemente, deren Inhaltsmodell beliebige Fluss- oder Phraseninhalte erlaubt, sollten mindestens einen Knoten in ihrem Inhalt haben, der greifbarer Inhalt ist und nicht das hidden
-Attribut spezifiziert hat.
Die greifbaren Elemente sind:
<a>
<abbr>
<address>
<article>
<aside>
<b>
<bdi>
<bdo>
<blockquote>
<button>
<canvas>
<cite>
<code>
<data>
<del>
<details>
<dfn>
<div>
<em>
<embed>
<fieldset>
<footer>
<figure>
<form>
<iframe>
<img>
<ins>
<kbd>
<label>
<main>
<map>
<mark>
<math>
<meter>
<nav>
<object>
<p>
<picture>
<pre>
<progress>
<q>
<ruby>
<s>
<samp>
<search>
<section>
<select>
<small>
<span>
<strong>
<sub>
<sup>
<svg>
<table>
<textarea>
<time>
<u>
<var>
<video>
- Autonome benutzerdefinierte Elemente
- Klartext, der keine Leerzeichen zwischen den Elementen ist
Einige Elemente gehören zu dieser Kategorie nur unter bestimmten Bedingungen:
<audio>
, wenn dascontrols
-Attribut vorhanden ist<dl>
, wenn die Kinder des Elements mindestens eine Name-Wert-Gruppe enthalten<input>
, wenn das type-Attribut nicht im versteckten Zustand ist<ol>
, wenn seine Kinder mindestens ein<li>
-Element enthalten<ul>
, wenn seine Kinder mindestens ein<li>
-Element enthalten
Skriptunterstützende Elemente
Skriptunterstützende Elemente sind Elemente, die nicht direkt zum gerenderten Output eines Dokuments beitragen. Stattdessen dienen sie zur Unterstützung von Skripten, entweder indem sie Skriptcode direkt enthalten oder spezifizieren oder indem sie Daten angeben, die von Skripten genutzt werden. Fast alle Elemente, einschließlich solcher, die nur spezifische Elemente aufnehmen (wie <ul>
, das <li>
-Elemente aufnimmt), können skriptunterstützende Elemente enthalten.
Die skriptunterstützenden Elemente sind:
Formularassoziierter Inhalt
Formularassoziierte Inhalte sind eine Unterkategorie von Flussinhalten, die Elemente umfassen, die einen Formular-Besitzer haben und überall dort verwendet werden können, wo Flussinhalt erwartet wird. Ein Formular-Besitzer ist entweder das beinhaltende <form>
-Element oder das <form>
, dessen id
im form
-Attribut des Elements angegeben ist.
Die formularassoziierten Elemente sind:
Diese Kategorie enthält mehrere Unterkategorien:
- gelistet
-
Elemente, die in den
HTMLFormElement.elements
undHTMLFieldSetElement.elements
-Sammlungen aufgeführt sind. Dazu gehören<button>
,<fieldset>
,<input>
,<object>
,<output>
,<select>
und<textarea>
. - submitbar
-
Elemente, die zur Erstellung des Formulardatensatzes verwendet werden können, wenn das Formular abgeschickt wird. Dazu gehören
<button>
,<input>
,<select>
und<textarea>
. - rücksetzbar
-
Elemente, die betroffen sind, wenn ein Formular zurückgesetzt wird. Dazu gehören
<input>
,<output>
,<select>
und<textarea>
. - Autokapitalisierungs- und Autokorrektur-vererbende
-
Elemente, die die
autocapitalize
- undautocorrect
-Attribute von ihrem Formulareigner erben. Dazu gehören<button>
,<fieldset>
,<input>
,<output>
,<select>
und<textarea>
. - beschriftungsfähig
-
Elemente, die mit
<label>
-Elementen assoziiert werden können. Dazu gehören<button>
,<input>
(alle Typen außerhidden
),<meter>
,<output>
,<progress>
,<select>
und<textarea>
.
Transparentes Inhaltsmodell
Wenn ein Element ein transparentes Inhaltsmodell hat, dann müssen seine Inhalte so strukturiert sein, dass sie gültiges HTML wären, selbst wenn das transparente Element entfernt und durch die Kindelemente ersetzt würde.
Zum Beispiel sind die <del>
- und <ins>
-Elemente transparent:
<p><del>Shopping</del> <ins>Returns</ins> list</p>
<ul>
<del>
<li>Oranges</li>
<li>Toilet paper</li>
</del>
<li>Toothpaste</li>
</ul>
Wenn diese Elemente entfernt würden, wäre dieses Fragment weiterhin gültiges HTML (wenn auch nicht korrektes Englisch).
<p>Shopping Returns list</p>
<ul>
<li>Oranges</li>
<li>Toilet paper</li>
<li>Toothpaste</li>
</ul>