HTML Footer Tag

The HTML <footer> tag defines a footer section of an HTML document. Typically, this tag includes content, such as author information, copyright information, important page links, etc.

The <footer> tag is one of the latest sectioning tags in HTML5. This tag defines the footer section in an HTML document. It can usually be applied at the end of an HTML document, i.e., at the bottom of an HTML page.

Syntax:

<footer>Write your content here.</footer>

The <footer> tag defines the footer for its closest sectioning content or sectioning root element. An HTML footer tag typically can hold data concerning the author of the section, copyright information, or links to corresponding documents. It thus allows the readers to read a long document and encounter the details they want quickly. The page numbering section is a simple example of this HTML tag and becomes essential in any long document.

Users are not required to compulsorily add <footer> tags to an HTML document. The <footer> tag does not mandate its use, and it is not mandatory to have headers and footers in an HTML document. Even if users do not add this tag, there will be no problem in their program, and it will still run. Nevertheless, it is not required by the web browsers yet suggested from the SEO point of view. They are semantic tags; that better help search engines analyze the webpage.

Example:

The HTML code below is an example of a footer tag styled using CSS. It displays copyright information:

<!DOCTYPE html>
<html>

    <head>
        <title>Example of HTML footer tag</title>
        <style>
            body {
                font-family: Inter, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", "Liberation Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
            }
            
            footer {
                width: 100%;
                background-color: #212529;
                color: white;
                text-align: center;
            }
        </style>
    </head>

    <body>
        <h1>Example of a HTML &lt;footer&gt;element that has been styled using CSS.</h1>
        <p>The &lt;footer&gt; tag is one of the latest sectioning tags in HTML5. This tag defines the &lt;footer&gt; section in an HTML document. It can usually be applied at the end of an HTML document, i.e. at the bottom of an HTML page.</p>
        <p>The &lt;footer&gt; HTML tag defines the &lt;footer&gt; for its closest sectioning content or sectioning root element. A &lt;footer&gt; typically can hold data concerning the author of the section, copyright information, or links to corresponding documents. It thus allows the readers to read a long document and encounter the details they want quickly. The page numbering section is a simple example of this HTML tag and becomes essential in any long document.</p>
        <p>Users are not required to compulsorily add &lt;footer&gt; tags to an HTML document. The &lt;footer&gt; tag does not mandate its use, and it is not mandatory to have headers and footers in an HTML document. Even if users do not add this tag, there will be no problem in their program, and it will still run. Nevertheless, it is not required by the web browsers yet suggested from the SEO point of view. They are semantic tags; that better help search engines analyze the webpage.</p>
        <footer>
            <p>© 2009 — 2022 W3schools® of Technology.</p>
        </footer>
    </body>

</html>
Found This Page Useful? Share It!
Get the Latest Tutorials and Updates
Join us on Telegram