HTML Headings

AuthorHariom Prajapati

Pubish Date03 Jul 2022

categoryHTML 5

It is used to define headings and subheadings within a webpage. These tags are essential for structuring and organizing the content of a webpage hierarchically.

  • There are six heading tags (h1 to h6), each heading tag have different default text size.
  • We can change text size of each heading according to our needs using CSS
  • it is used in the body tag.

Syntax -

<h1>  </h1>
<h2>  </h2>
<h3>  </h3>
<h4>  </h4>
<h5>  </h5>
<h6>  </h6>

For example

<!DOCTYPE html>
<html lang="en">
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>HTML Heading Tags</title>
<p style="color:green;font-size:32px;font-weight:700">Default size</p>

    <h1>Heading 1</h1>
    <h2>Heading 2</h2>
    <h3>Heading 3</h3>
    <h4>Heading 4</h4>
    <h5>Heading 5</h5>
    <h6>Heading 6</h6>

<p style="color:green;font-size:32px;font-weight:700">Set custom size for each headings</p>

    <h1 style="font-size:60px">Heading 1</h1>
    <h2 style="font-size:48px">Heading 2</h2>
    <h3 style="font-size:32px">Heading 3</h3>
    <h4 style="font-size:22px">Heading 4</h4>
    <h5 style="font-size:16px">Heading 5</h5>
    <h6 style="font-size:10px">Heading 6</h6>


Try it Yourself »

Headings Are Important

  • Search engines use the headings to index the structure and content of your web pages.
  • <h1> headings should be used for main headings, followed by <h2> headings, then the less important <h3>, and so on.


Only use HTML heads for headings. Headings should not be used to make big or bold content.