HTML Footer Tag

The <footer> tag in HTML represents the footer section of a web page. This section typically contains information about the website or its author, such as copyright notices, contact information, and links to social media profiles.

The footer is usually displayed at the bottom of the page, although its exact placement can be controlled using CSS.

Syntax

Here is the basic syntax for the <footer> tag:

1<footer> 2 <!-- footer content goes here --> 3</footer>

Example

1<!DOCTYPE html> 2<html> 3 <head> 4 <title>Example Website</title> 5 </head> 6 <body> 7 <header> 8 <h1>Example Website</h1> 9 <nav> 10 <a href="#">Home</a> 11 <a href="#">About</a> 12 <a href="#">Contact</a> 13 </nav> 14 </header> 15 <main> 16 <article> 17 <h2>Article Title</h2> 18 <p>Article content goes here.</p> 19 </article> 20 </main> 21 <footer> 22 <p>&copy; 2023 Example Website. All rights reserved.</p> 23 </footer> 24 </body> 25</html>

In this example, the <footer> tag is used to display a copyright notice for the website.

Styling the Footer

The appearance of the footer can be customized using CSS. Here's an example of how you can center the content of the footer and add a background color:

1footer { 2 text-align: center; 3 background-color: #f5f5f5; 4 padding: 10px; 5}