Arrow
Logo

HTML 5

Introduction to HTML

HTML basic tags

HTML Elements and Attributes

HTML Formatting

HTML phrase tags

HTML Meta tags

HTML Comments

HTML images

HTML Tables

HTML List

HTML Form

HTML Headings

HTML Paragraphs

HTML Line Break

HTML Pre Tag

HTML <hr> Tag

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">
<head>
    <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>
</head>
<body>
<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>
</body>
</html>

Output

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.

Note

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