Dieser Inhalt wurde automatisch aus dem Englischen übersetzt, und kann Fehler enthalten.Erfahre mehr über dieses Experiment.
<article>: Das Artikel-Inhaltselement
Baseline Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since Juli 2015.
Das<article>-Element repräsentiert eine eigenständige Zusammenstellung in einem Dokument, einer Seite, Anwendung oder Website, die dazu bestimmt ist, eigenständig verteilbar oder wiederverwendbar zu sein (z. B. in der Syndizierung). Beispiele umfassen: einen Forenbeitrag, einen Magazin- oder Zeitungsartikel, einen Blogeintrag, eine Produktkarte, einen von Nutzern eingesendeten Kommentar, ein interaktives Widget oder Gadget oder jeden anderen unabhängigen Inhaltsgegenstand.
Probieren Sie es aus
<article> <h1>Weather forecast for Seattle</h1> <article> <h2>03 March 2018</h2> <p>Rain.</p> </article> <article> <h2>04 March 2018</h2> <p>Periods of rain.</p> </article> <article> <h2>05 March 2018</h2> <p>Heavy rain.</p> </article></article>.forecast { margin: 0; padding: 0.3rem; background-color: #eeeeee;}.forecast > h1,.day-forecast { margin: 0.5rem; padding: 0.3rem; font-size: 1.2rem;}.day-forecast { background: right/contain content-box border-box no-repeat url("/shared-assets/images/examples/rain.svg") white;}.day-forecast > h2,.day-forecast > p { margin: 0.2rem; font-size: 1rem;}Ein gegebenes Dokument kann mehrere Artikel enthalten; zum Beispiel auf einem Blog, der den Text jedes Artikels nacheinander zeigt, während der Leser scrollt, wäre jeder Beitrag in einem<article>-Element enthalten, möglicherweise mit einem oder mehreren<section>-Elementen darin.
Attribute
Dieses Element umfasst nur dieglobalen Attribute.
Nutzungshinweise
- Jedes
<article>sollte identifiziert werden, typischerweise durch das Einschließen einer Überschrift (ein<h1>-<h6>-Element) als Kind des<article>-Elements. - Wenn ein
<article>-Element verschachtelt ist, repräsentiert das innere Element einen Artikel, der mit dem äußeren Element in Beziehung steht. Zum Beispiel können die Kommentare eines Blogbeitrags<article>-Elemente sein, die im<article>enthalten sind, das den Blogbeitrag repräsentiert. - Autoreninformationen eines
<article>-Elements können durch das<address>-Element bereitgestellt werden, aber das gilt nicht für verschachtelte<article>-Elemente. - Das Veröffentlichungsdatum und die -zeit eines
<article>-Elements können mit demdatetime-Attribut eines<time>-Elements beschrieben werden.
Beispiele
<article> <h2>Jurassic Park</h2> <section> <h3>Review</h3> <p>Dinos were great!</p> </section> <section> <h3>User reviews</h3> <article> <h4>Too scary!</h4> <p>Way too scary for me.</p> <footer> <p> Posted on <time datetime="2015-05-16 19:00">May 16</time> by Lisa. </p> </footer> </article> <article> <h4>Love the dinos!</h4> <p>I agree, dinos are my favorite.</p> <footer> <p> Posted on <time datetime="2015-05-17 19:00">May 17</time> by Tom. </p> </footer> </article> </section> <footer> <p> Posted on <time datetime="2015-05-15 19:00">May 15</time> by Staff. </p> </footer></article>Ergebnis
Technische Zusammenfassung
| Inhaltskategorien | Fließender Inhalt,Sektionierender Inhalt,Greifbarer Inhalt |
|---|---|
| Erlaubte Inhalte | Fließender Inhalt. |
| Tag-Auslassung | Keine, sowohl das Start- als auch das End-Tag sind obligatorisch. |
| Erlaubte Eltern | Jedes Element, dasfließenden Inhalt akzeptiert. Beachten Sie, dass ein<article>-Element kein Nachfahre eines<address>-Elements sein darf. |
| Implizite ARIA-Rolle | article |
| Erlaubte ARIA-Rollen | application,document,feed,main,none,presentation,region |
| DOM-Schnittstelle | [`HTMLElement`](/de/docs/Web/API/HTMLElement) |
Spezifikationen
| Specification |
|---|
| HTML # the-article-element |