The HTML <footer> Tag

Definition and Usage

<footer> Tag defines the footer of the document or section.

<footer> The element usually contains:

  • Author Information
  • Copyright Information
  • Contact Information
  • Site Map
  • Back to Top link
  • related pages

You can include multiple <footer> Element.

See also:

HTML DOM Reference Manual:Footer Object

Instance

Example 1

The footer part of the document:

<footer>
  <p>Author: Bill Gates</p>
  <p><a href="mailto:bill@example.com">bill@example.com</a></p>
</footer>

Try It Yourself

Example 2

Using CSS to set <footer> The style:

<html>
<head>
<style>
footer {
  text-align: center;
  padding: 3px;
  background-color: DarkSalmon;
  color: white;
}
</style>
</head>
<body>
<footer>
  <p>Author: Bill Gates<br>
  <a href="mailto:bill@example.com">bill@example.com</a></p>
</footer>
</body>
</html>

Try It Yourself

Tips and Comments

Tip:<footer> Contact information within the element should be placed <address> within the tag.

Global Attributes

<footer> The tag also supports Global Attributes in HTML.

Event Attributes

<footer> The tag also supports Event Attributes in HTML.

Default CSS Settings

Most browsers will use the following default values to display <footer> Element:

footer {
  display: block;
}

Browser Support

The numbers in the table indicate the first browser version to fully support the element.

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
5.0 9.0 4.0 5.0 11.1