Related Articles

Related Articles

How to define header for a document or section using HTML ?
  • Last Updated : 26 Nov, 2020

The <header> tag in HTML is used to define the header for a document or a section. It contains information related to the title and heading of the related content. The <header> element is intended to usually contain the section’s heading (an h1-h6 element or an <hgroup> element), but this is not required.

The <header> element can also be used to wrap a section’s table of contents, a search form, or any relevant logos. The <header> tag is a new tag in HTML5 and it requires a starting tag as well as an end tag.

There can be several <header> elements in one document.

A <header> tag cannot be placed within a <footer>, <address> or another <header> element.

Syntax:



<header> Contents... </header>

Example:

HTML

filter_none

edit
close

play_arrow

link
brightness_4
code

<!DOCTYPE html>
<html>
  
<head>
    <title>
        How to define a header for a document
        or section using HTML?
    </title>
    <style>
        h1 {
            color: green;
        }
  
        body {
            text-align: center;
        }
    </style>
</head>
  
<body>
    <header>
        <h1>GeeksforGeeks</h1>
  
        <h2>
            How to define a header for a document
            or section using HTML?
        </h2>
          
        <p>
                Algo</a> |
            <a href="https://www.geeksforgeeks.org/data-structures/">
                DS</a> |
            <a href="https://www.geeksforgeeks.org/category/program-output/">
                Languages</a> |
                Interview</a> |
            <a href="https://www.geeksforgeeks.org/student-corner/">
                Students</a> |
            <a href="https://www.geeksforgeeks.org/gate-cs-notes-gq/">
                Gate</a> |
                CS Subjects</a> |
            <a href="https://www.geeksforgeeks.org/quiz-corner-gq/">
                Quizzes</a>
        </p>
  
    </header>
</body>
  
</html>

chevron_right


Output:

full-stack-img




My Personal Notes arrow_drop_up
Recommended Articles
Page :