Menu

HTML header Tag

HTML header Tag

In HTML, to define the heading section of an HTML document <header> tag is used.

  • In the <header> tag, you can use other HTML elements like <h1>, <nav>, <ul>, <a>, etc.
  • The <header> tag is newly introduced in HTML5. This tag is more of a group tag used to group other tags together which are used to create heading section on a webpage.
  • It is basically used to provide introductory content on an HTML Page.
  • Also, this is a block-level element.

HTML <header> Tag - Syntax and Usage

The <header> tag requires the start(opening) tag and end(closing) tag.

<header>
    ...content here
</header>

HTML <header> Tag Basic Example

Below we have a basic example for a clear understanding of <header> tag:

<!doctype html>
<html>
    <head>
        <title>Header Element</title>
    </head>
    <body>
        <header>
            <h1>This is an Example for Header Element Usage</h1>
            <a href="https://www.studytonight.com/">Home Page</a>
                <ul>
                    <li><a href="https://www.studytonight.com/library/">Tutorials</a></li>
                    <li><a href="https://www.studytonight.com/about/">About Us</a></li>
                    <li><a href="https://www.studytonight.com/contact/">Contact Us</a></li>
                </ul>
        </header>
    </body>
</html>

HTML <header> Tag Attributes

This element does not have any specific attributes although this element supports Global attributes and Event attributes.

Default CSS settings for HTML <header> Tag

header {
    display: block;
}

Browser Support for HTML <header> Tag

Following browsers support this attribute:

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