HTML Footer Tag

HTML footer

The footer tag is often used to represent the footer for the HTML document, which typically contains the things like copyright information, contact information, other links, some documents, etc. You can have many footer tags inside one HTML document.

Here is the code for using the footer tag →

<!DOCTYPE html>
<html lang=”en”>
<head>
<meta charset=”UTF-8″>
<meta http-equiv=”X-UA-Compatible” content=”IE=edge”>
<meta name=”viewport” content=”width=device-width, initial-scale=1.0″>
<title>Some heading here…</title>
</head>
<body>
<header>
<img src=”logo.png” alt=”GyaniPandit logo” width=”100px” height=”50px”>
<nav>
<a href=”#”>Home</a>
<a href=”#”>Services</a>
<a href=”#”>About us</a>
<a href=”#”>Explore</a>
</nav>
<h1>Welcome to the best webpage!</h1>
</header>
<h2>Lorem ipsum dolor sit.</h2>
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Vero et nemo laboriosam maxime labore sapiente itaque accusantium, nesciunt perferendis? Reiciendis officia et deserunt cum a magnam ipsum ut molestiae nisi.</p>


<h2>Lorem, ipsum dolor.</h2>
<div>Lorem ipsum dolor sit amet consectetur adipisicing elit. Nesciunt ducimus labore, expedita vero consectetur harum voluptatibus aliquid assumenda, nihil architecto corrupti ipsum earum explicabo libero nam eius. Laudantium, praesentium cupiditate.
Non quia nulla voluptate repudiandae culpa a numquam corrupti molestias vitae cum, inventore similique rerum laudantium modi, deserunt quos. Placeat illo itaque ex autem obcaecati asperiores ipsum natus excepturi eligendi?
Ullam laborum, temporibus atque commodi nihil excepturi illo error nostrum iste aliquid magnam blanditiis odio culpa accusantium doloribus quam incidunt asperiores placeat dolore voluptatem, nemo et sequi nesciunt. Ratione, odio.
Quas suscipit quisquam, quam vitae, eveniet temporibus doloremque, sit officia enim commodi quia dignissimos similique. Sunt dolorem labore quisquam voluptates, suscipit doloremque! Quae id voluptate modi architecto eum voluptatum hic!</div>
<br>
<footer>
&copy; gyanipandit.com, All rights reserved.
</footer>
</body>
</html>

Well, as you can see, in the footer, we have some copyright information here. We can also have some other links/navigation, some contact information, etc.

Have a look at the output –

html footer tag

In the above output, the bottom line is the footer thing. The page may look somewhat ordinary, but it is a great achievement for us, that we are now able to get many parts of the HTML. Later on, when you get into the concepts of CSS, you will be able to style the page in a better way.