The **`<header>`** element in HTML is used to display the introductory content of the webpage. This includes the heading, any sub-headings, logo, author's name, and navigational links for the website. For example, `<header>` can be used to wrap the title of an article, the author's name, and the byline of the article. 

Elements that can be used inside the `<header>` element include:
* `<h1>`-`<h6>` 
* `<hgroup>`   
* `<p>` 

However, `<header>` cannot be placed under:
* another `<header>` 
* `<footer>` 
* `<address>` 

# Example 

<!DOCTYPE html>
<html>
<body>

<header class="shot-header">
  <hgroup>
    <h1>Header element</h1>
    <h2>in HTML5</h2>
    <h3>by Abdul Monum</h3>
  </hgroup>
</header>
<p>Header element displays the introductory content of the webpage.</p>

</body>
</html>


hgroup {
    text-align: center;
    font-family: Cambria, Cochin, Georgia, Times, 'Times New Roman', serif;
    border-right: 6px solid #c9d700;
}

h1 {
    font-size: 2.05rem;
    margin-bottom: 0;
}

h2 {
    font-size: 1.55rem;
    margin-top: 0;
}

h3 {
    font-size: 0.95rem;
    margin-top: 0;
}

p {
    text-align: justify;
    font-family: Georgia, 'Times New Roman', Times, serif;
    font-size: .95rem;
}

codemirror

# Explanation
In lines 5-11, you can see the `<header>` element and the elements inside it that display the introductory content of the simple webpage. 
* `<hgroup>` groups the `<h1>`, `<h2>`, and `<h3>` headings.
* `<h1>` and `<h2>` display the main heading of the page.
* `<h3>` heading displays the author of the page. 
* `<header>` acts as a container that wraps this introductory content.

What is the <header> element in HTML?

Used for introductory content, the HTML `<header>` element wraps titles, authors, and navigation links.