<footer>
The <footer>
HTML element represents a footer for its nearest ancestor sectioning content or sectioning root element. A <footer>
typically contains information about the author of the section, copyright data or links to related documents.
Try it
Content categories | Flow content, palpable content. |
---|---|
Permitted content |
Flow content, but with no <footer> or
<header> descendants.
|
Tag omission | None, both the starting and ending tag are mandatory. |
Permitted parents |
Any element that accepts
flow content. Note that a <footer> element must not be a
descendant of an <address> ,
<header> or another
<footer> element.
|
Implicit ARIA role |
contentinfo, or
no corresponding role
if a descendant of an
article,
aside,
main,
nav or
section element, or
an element with
role=article ,
complementary,
main,
navigation
or
region
|
Permitted ARIA roles |
group , presentation or
none
|
DOM interface | HTMLElement |
Attributes
This element only includes the global attributes.
Usage notes
- Enclose information about the author in an
<address>
element that can be included into the<footer>
element. - When the nearest ancestor sectioning content or sectioning root element is the body element the footer applies to the whole page.
- The
<footer>
element is not sectioning content and therefore doesn't introduce a new section in the outline.
Examples
html
<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>
css
footer {
text-align: center;
padding: 5px;
background-color: #abbaba;
color: #000;
}
Accessibility concerns
Prior to the release of Safari 13, the contentinfo
landmark role was not properly exposed by VoiceOver. If needing to support legacy Safari browsers, add role="contentinfo"
to the footer
element to ensure the landmark will be properly exposed.
Specifications
Specification |
---|
HTML Standard # the-footer-element |
Browser compatibility
BCD tables only load in the browser