HTML5 | <footer> Tag

Difficulty Level : Easy
Last Updated : 17 Jul, 2019

The <footer> tag in HTML is used to define a footer of HTML document. This section contains the footer information (author information, copyright information, carriers, etc). The footer tag is used within the body tag. The <footer> tag is new in the HTML5. The footer elements require a start tag as well as an end tag.

Syntax :

<footer> ... </footer>

A footer element typically contains authorship information, copyright information, contact information, sitemap, back to top links, related documents, etc.

Below examples illustrate the <footer> Tag in HTML elements:

Example:

<!DOCTYPE html> 
<html> 
    <head> 
        <title>HTML footer Tag</title> 
        <style> 
            a { 
                font-size:25px; 
                text-decoration:none; 
            } 
            p { 
                font-size:25px; 
            } 
        </style> 
    </head> 
    <body> 
        <footer> 
            <nav> 
                <p> 
                    <a href= 
"https://www.geeksforgeeks.org/about/">About Us</a>|  
                    <a href= 
"https://www.geeksforgeeks.org/privacy-policy/">Privacy Policy</a>|  
                    <a href= 
"https://www.geeksforgeeks.org/careers/">Careers</a>  
                </p> 
            </nav> 
            <p>@geeksforgeeks, Some rights reserved</p> 
        </footer> 
    </body> 
</html>                     

Output:

Example 2:

<!DOCTYPE html> 
<html> 
    <head> 
        <title>footer tag</title> 
        <style> 
            .column { 
                float: left; 
                width: 27%; 
               height: 300px;  
            } 
            p { 
                font-size:20px; 
                font-weight:bold; 
            } 
        </style> 
    </head> 
    <body> 
        <footer> 
            <div class="column"> 
                <p>Company</p> 
                <ul style="list-style-type:disc"> 
                    <li>About Us</li> 
                    <li>Careers</li> 
                    <li>Privacy Policy</li> 
                    <li>Contact Us</li> 
                </ul> 
            </div> 
                
            <div class="column"> 
                <p>Learn</p> 
                <ul> 
                    <li>Algorithms</li> 
                    <li>Data Structures</li> 
                    <li>Languages</li> 
                    <li>CS Subjects</li> 
                    <li>Video Tutorials</li> 
                </ul> 
            </div> 
                 
            <div class="column"> 
                <p>Practice</p> 
                <ul> 
                    <li>Company-wise</li> 
                    <li>Topic-wise</li> 
                    <li>Contests</li> 
                    <li>Subjective Questions</li> 
                </ul> 
            </div> 
        </footer> 
    </body> 
</html> 

Output:

Browser Support: The footer tag is new in HTML5 and it supports in the browser which are listed below:

Google Chrome 6.0
Internet Explorer 9.0
Firefox 4.0
Opera 11.1
Safari 5.0

My Personal Notes

Related Articles