Dieser Inhalt wurde automatisch aus dem Englischen übersetzt, und kann Fehler enthalten.Erfahre mehr über dieses Experiment.
<footer>: Das Footer-Element
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<footer>HTML-Element repräsentiert ein Footer für sein nächstes übergeordnetesSectioning-Content- oderSectioning-Root-Element. Ein<footer> enthält typischerweise Informationen über den Autor der Sektion, Copyright-Daten oder Links zu verwandten Dokumenten.
Probieren Sie es aus
<article> <h1>How to be a wizard</h1> <ol> <li>Grow a long, majestic beard.</li> <li>Wear a tall, pointed hat.</li> <li>Have I mentioned the beard?</li> </ol> <footer> <p>© 2018 Gandalf</p> </footer></article>article { min-height: 100%; display: grid; grid-template-rows: auto 1fr auto;}footer { display: flex; justify-content: center; padding: 5px; background-color: #45a1ff; color: white;}Attribute
Dieses Element umfasst nur dieglobalen Attribute.
Anwendungshinweise
- Schließen Sie Informationen über den Autor in ein
<address>-Element ein, das in das<footer>-Element aufgenommen werden kann. - Wenn das nächste übergeordnete Sectioning-Content- oder Sectioning-Root-Element das Body-Element ist, gilt der Footer für die gesamte Seite.
- Das
<footer>-Element ist kein Sectioning-Content und führt daher nicht zu einem neuen Abschnitt in derGliederung.
Barrierefreiheit
Vor der Veröffentlichung von Safari 13 wurde diecontentinfoLandmark-Rolle nicht korrekt vonVoiceOver dargestellt. Wenn Sie ältere Safari-Browser unterstützen müssen, fügen Sierole="contentinfo" zumfooter-Element hinzu, um sicherzustellen, dass das Landmark korrekt dargestellt wird.
Beispiele
<body> <h3>FIFA World Cup top goalscorers</h3> <ol> <li>Miroslav Klose, 16</li> <li>Ronaldo Nazário, 15</li> <li>Gerd Müller, 14</li> </ol> <footer> <small> Copyright © 2023 Football History Archives. All Rights Reserved. </small> </footer></body>footer { text-align: center; padding: 5px; background-color: #abbaba; color: black;}Technische Zusammenfassung
| Inhaltskategorien | Flow-Content, greifbarer Inhalt. |
|---|---|
| Erlaubte Inhalte | Flow-Content, aber ohne<footer>- oder<header>-Nachkommen. |
| Tag-Auslassung | Keine, sowohl der Start- als auch der End-Tag sind erforderlich. |
| Erlaubte Eltern-Elemente | Jedes Element, dasFlow-Content akzeptiert. Beachten Sie, dass ein<footer>-Element kein Nachkomme eines<address>,<header> oder eines anderen<footer>-Elements sein darf. |
| Implizite ARIA-Rolle | contentinfo, odergeneric wenn ein Nachkomme einesarticle,aside,main,nav odersection-Elements, oder eines Elements mitarticle,complementary,main,navigation oderregion-Rolle |
| Erlaubte ARIA-Rollen | group,presentation odernone |
| DOM-Interface | [`HTMLElement`](/de/docs/Web/API/HTMLElement) |
Spezifikationen
| Specification |
|---|
| HTML # the-footer-element |