diff options
Diffstat (limited to 'files/de/web/html/element/article/index.html')
| -rw-r--r-- | files/de/web/html/element/article/index.html | 146 |
1 files changed, 146 insertions, 0 deletions
diff --git a/files/de/web/html/element/article/index.html b/files/de/web/html/element/article/index.html new file mode 100644 index 0000000000..44d07c202c --- /dev/null +++ b/files/de/web/html/element/article/index.html @@ -0,0 +1,146 @@ +--- +title: '<article>: Das Inhaltselement für Artikel' +slug: Web/HTML/Element/article +tags: + - Element + - HTML + - HTML Bereiche + - HTML5 + - Referenz + - Web +translation_of: Web/HTML/Element/article +--- +<div>{{HTMLRef}}</div> + +<p>Das <strong>HTML-Element <code><article></code></strong> stellt eine in sich geschlossene Komposition in einem Dokument, einer Seite, Anwendung oder Website dar, die unabhängig verteilt oder wiederverwendbar sein soll (z. B. bei Syndikation), z. B. ein Forumsbeitrag, ein Zeitschriften- oder Zeitungsartikel oder ein Blogeintrag.</p> + +<div>{{EmbedInteractiveExample("pages/tabbed/article.html", "tabbed-standard")}}</div> + +<p class="hidden">The source for this interactive example is stored in a GitHub repository. If you'd like to contribute to the interactive examples project, please clone <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples </a> and send us a pull request.</p> + +<p>Ein bestimmtes Dokument kann mehrere Artikel enthalten, z. B. in einem Blog, in dem der Text jedes Artikels nacheinander angezeigt wird, während der Leser blättert, wäre jeder Beitrag in einem <code><article></code>-Element mit einem oder mehreren <code><section></code>-Elementen enthalten.</p> + +<table class="properties"> + <tbody> + <tr> + <th scope="row"><a href="/de/docs/HTML/Content_categories">Inhaltskategorien</a></th> + <td><a href="/de/docs/HTML/Content_categories#Flow_content">Fließender Inhalt</a>, Sektionsinhalt, fühlbarer Inhalt</td> + </tr> + <tr> + <th scope="row">Erlaubter Inhalt</th> + <td><a href="/de/docs/HTML/Content_categories#Flow_content">Fließender Inhalt</a>.</td> + </tr> + <tr> + <th scope="row">Tag Wegfall</th> + <td>{{no_tag_omission}}</td> + </tr> + <tr> + <th scope="row">Erlaubte Elternelemente</th> + <td>Jedes Element das <a href="/de/docs/HTML/Content_categories#Flow_content">fließenden Inhalt</a> erlaubt. Beachten Sie, dass ein <code><article></code>-Element kein Nachkomme eines {{HTMLElement("address")}}-Elements sein darf.</td> + </tr> + <tr> + <th scope="row">Erlaubte ARIA Rollen</th> + <td>{{ARIARole("application")}}, {{ARIARole("document")}}, {{ARIARole("feed")}}, {{ARIARole("main")}}, {{ARIARole("presentation")}}, {{ARIARole("region")}}</td> + </tr> + <tr> + <th scope="row">DOM-Schnittstelle</th> + <td>{{domxref("HTMLElement")}}</td> + </tr> + </tbody> +</table> + +<h2 id="Attribute">Attribute</h2> + +<p>Dieses Element unterstützt nur die <a class="new" href="/de/docs/Web/HTML/Global_attributes" rel="nofollow">globalen Attribute</a>.</p> + +<h2 id="Nutzungshinweise">Nutzungshinweise</h2> + +<ul> + <li>Jeder <code><article></code> sollte beschriftet sein, normalerweise indem eine Überschrift (<a href="/de/docs/Web/HTML/Element/Heading_Elements"><code><h1></code>-<code><h6></code></a>) als untergeordnetes Element des <code><article></code>-Elements eingefügt wird.</li> + <li>Wenn ein <code><article></code>-Element verschachtelt ist, repräsentiert das innere Element einen Artikel, der sich auf das äußere Element bezieht. Zum Beispiel können die Kommentare eines Blogbeitrags <code><article></code>-Elemente sein, die im <code><article></code> des Blogbeitrags verschachtelt sind.</li> + <li>Informationen zum Autor eines <code><article></code>-Elements können über das {{HTMLElement("address")}}-Element bereitgestellt werden, gelten jedoch nicht für verschachtelte <code><article></code>-Elemente.</li> + <li>Das Datum und die Uhrzeit der Veröffentlichung eines <code><article></code>-Elements können mit dem Attribut {{htmlattrxref("datetime", "time")}} eines {{HTMLElement("time")}}-Elements beschrieben werden. <em>Beachten Sie, dass das Attribut {{htmlattrxref("pubdate", "time")}} von {{HTMLElement("time")}} nicht mehr Bestandteil des W3C HTML 5-Standards ist.</em></li> +</ul> + +<h2 id="Beispiele">Beispiele</h2> + +<pre class="brush: html"><article class="film_review"> + <header> + <h2>Jurassic Park</h2> + </header> + <section class="main_review"> + <p>Dinos were great!</p> + </section> + <section class="user_reviews"> + <article class="user_review"> + <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 class="user_review"> + <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> +</pre> + +<h2 id="Spezifikationen">Spezifikationen</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">Specification</th> + <th scope="col">Status</th> + <th scope="col">Comment</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('HTML WHATWG', 'semantics.html#the-article-element', '<article>')}}</td> + <td>{{Spec2('HTML WHATWG')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('HTML5.1', 'sections.html#the-article-element', '<article>')}}</td> + <td>{{Spec2('HTML5.1')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('HTML5 W3C', 'sections.html#the-article-element', '<article>')}}</td> + <td>{{Spec2('HTML5 W3C')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="Browserkompatibilität">Browserkompatibilität</h2> + + + +<p>{{Compat("html.elements.article")}}</p> + +<h2 id="Siehe_auch">Siehe auch</h2> + +<ul> + <li>Andere abschnittsbezogene Elemente: {{HTMLElement("body")}}, {{HTMLElement("nav")}}, {{HTMLElement("section")}}, {{HTMLElement("aside")}}, {{HTMLElement("h1")}}, {{HTMLElement("h2")}}, {{HTMLElement("h3")}}, {{HTMLElement("h4")}}, {{HTMLElement("h5")}}, {{HTMLElement("h6")}}, {{HTMLElement("hgroup")}}, {{HTMLElement("header")}}, {{HTMLElement("footer")}}, {{HTMLElement("address")}}</li> + <li class="last"><a class="deki-ns current" href="/de/docs/Web/Guide/HTML/Sections_and_Outlines_of_an_HTML5_document">Abschnitte und Umrisse eines HTML5-Dokuments</a></li> +</ul> |
