<footer> - HTML CSS HTML Tag

HTML CSS examples for HTML Tag:footer

  1. HOME
  2. HTML CSS
  3. HTML Tag
  4. footer

Introduction

The footer element represents the footer for a section.

A footer usually contains summary information about a section.

It can include details of the author, rights information, links to associated content, and logos and disclaimers.

The footer Element summary

Item Value
Element: footer
PermittedAny element that can contain flow elements.
Parents: The footer element cannot be a descendent of the address or header element and cannot be a descendant of another footer element.
Local Attributes:None
Contents:Flow content.
Tag Style: Start and end tags
New in HTML5? Yes
Changes in HTML5 N/A

Style Convention 

footer {
   display: block;
}

You can see the footer elements in the following code.

Demo Code

ResultView the demo in separate window 

<!DOCTYPE html>
<html>
   <head> 
      <title>Example</title> 
      <style>
h1, h2, h3 { background: grey; color: white; }
hgroup > h1 { margin-bottom: 0; margin-top: 0}
hgroup > h2 { background: grey; color: white; font-size: 1em;
margin-top: 0px; margin-bottom: 2px}
body > header  *, footer > * { background:transparent; color:black;}
body > section, body > section > section,
body > section > section > section {margin-left: 10px;}
body > header, body > footer {
   border: medium solid black; padding-left: 5px; margin: 10px 0 10px 0;
}

      </style> 
   </head> 
   <body> 
      <header> 
         <hgroup> 
            <h1>CSS</h1> 
            <h2>Introduction</h2> 
         </hgroup> 
      </header> 
      <footer id="mainFooter">
          ?2020, java2s.com. 
         <a href="http://java2s.com">Visit website</a> 
      </footer>  
   </body><!--from  w ww. j ava 2s.com-->
</html>

Related Tutorials