The
<footer>tag represents a footer section for its nearest sectioning content (like<body>,<article>,<section>).
It typically contains copyright info, author details, navigation links, or contact information.
Syntax
<footer>
<!-- Footer content like copyright, links, contact info -->
</footer>Attributes
| Attribute | Description |
|---|---|
| id | Assigns a unique identifier. |
| class | Specifies one or more class names. |
| style | Inline CSS styling. |
| title | Additional information about the element. |
Example
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Footer Tag Example</title>
</head>
<body>
<main>
<h1>Welcome to My Website</h1>
<p>This is an example of semantic footer usage.</p>
</main>
<footer style="background-color: #f0f0f0; padding: 15px; text-align: center;">
<p>© 2025 My Website. All rights reserved.</p>
<nav>
<a href="#">Privacy Policy</a> |
<a href="#">Terms of Service</a>
</nav>
</footer>
</body>
</html>Output
Browser Output
You will see a footer section at the bottom of the page containing copyright information and navigation links.
It visually separates the bottom of the content from the main section.
Use our TryIt Editor to test footer styling and content.
Browser Support
 Chrome |  Firefox |  Edge |  Safari |  Opera |  IE9+ |
|---|---|---|---|---|---|
| ✅Yes | ✅Yes | ✅Yes | ✅Yes | ✅Yes | ✅Yes |
All major browser supports <footer> tag.
Notes
<footer>is semantic, providing meaning to the page structure.- Can appear multiple times (e.g., for a main footer and individual articles).
- Helps improve SEO and accessibility.
- Can contain text, links, forms, or scripts.
Conclusion
The <footer> tag is ideal for bottom-of-page or section content, like copyright, contact, or links.
It adds semantic meaning and structural clarity to web pages.
