HTML5 <header> Tag

Topic: HTML5 Tags Reference« Prev|Next »

Description

The <header> element represents the header of a document or a section. A header should contain title and heading information about the related content.

The following table summarizes the usages context and the version history of this tag.

Placement: Block
Content: Block, Inline and text elements, but no <header> or <footer> descendants.
Start/End Tag: Start tag: required, End tag: required
Version: New in HTML5
 

Tip:Do not confuse the <header> element (which is a visible section of the page) with the <head> element (which contains metadata not shown to the user).


Syntax

The basic syntax of the <header> tag is given with:

HTML / XHTML: <header> ... </header>

The example below shows the <header> tag in action.

  • <header>
  •     <h1>Tutorial Republic</h1>
  •     <nav>
  •         <p><a href="#">Home</a> | <a href="#">About</a> | <a href="#">Contact</a></p>
  •     </nav>
  • </header>
 

Note:The <header> element can be placed anywhere inside the <body>, but it must not be placed within an <address>, <footer> or another <header> element.


Tag-Specific Attributes

The <header> tag doesn't have any specific attribute.


Global Attributes

Like all other HTML tags, the <header> tag supports the global attributes in HTML5.


Event Attributes

The <header> tag also supports the event attributes in HTML5.


Browser Compatibility

The <header> tag is supported in all major modern browsers.

Browsers Icon

Basic Support—

  • Firefox 4+
  • Google Chrome 6+
  • Internet Explorer 9+
  • Apple Safari 5.1+
  • Opera 11.1+

Further Reading

See tutorial on: HTML Layout.

Related tags: <body>, <nav>, <section>, <footer>.

 
Close

Your Feedback:

 

We would love to hear from you! Please say something.