The <header> element

The <header> element may contain some heading elements but also other elements like a logo, wrapped section's header, a search form, and so on. The header element should be used as a container for introductory content. You can have several header elements in one document.

Syntax:

<header></header>

Attributes:

global attributes
event attributes

NOTE: The <header> element may not be used inside a <footer>, <address> or other <header> element.

Example

The header tag example:

<!DOCTYPE html>
<html lang='en-us'>
<head><style type='text/css'>
    body{background-color:#343434;}
    article{background-color:#f4f4f4; padding:2px 5px;}
    header{background-color:#c4c4c4; padding:1px 2px;}
</style></head>
<body>
<article>
  <header>
    <h1>Main title goes here</h1>
    <p><time datetime="2015-02-27">27th February, 2015</time></p>
    <h2>Sub-title goes here</h2>
  </header>
  <p>The header element should be used as a container for introductory content. </p>
</article>
</body>
</html>

›› go to examples ››

The <header> element

Syntax:

Attributes:

Example

The header tag example:

Comments

About

Contact

Get Connected