HTML <h1> to <h6> (Headings) Tag

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

Meaning

The <h1> to <h6> HTML elements represent six levels of headings. <h1> is the highest level and <h6> is the lowest.

Notes:

Bad Practice

<h1>Heading level 1</h1>
<h3>Heading level 3</h3>
<h4>Heading level 4</h4>

Good Practice

<h1>Heading level 1</h1>
<h2>Heading level 2</h2>
<h3>Heading level 3</h3>

Version: HTML 2, 3.2, 4, 4.01, 5

Standard Syntax

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

Browser Support

Status

Global Attributes

<h1> to <h6> element also supports the Global Attributes in HTML.

Event Attributes

<h1> to <h6> element also supports the Event Attributes in HTML.

By Default CSS Value(s)

Most of the browsers will display the <h1> element with the following by default value(s)

h1 {
  display: block;
  font-weight: bold;
  font-size: 2em;
  margin-top: 0.67em;
  margin-bottom: 0.67em;
  margin-left: 0;
  margin-right: 0;
}

Most of the browsers will display the <h2> element with the following by default value(s)

h2 {
  display: block;
  font-weight: bold;
  font-size: 1.5em;
  margin-top: 0.83em;
  margin-bottom: 0.83em;
  margin-left: 0;
  margin-right: 0;
}

Most of the browsers will display the <h3> element with the following by default value(s)

h3 {
  display: block;
  font-weight: bold;
  font-size: 1.17em;
  margin-top: 1em;
  margin-bottom: 1em;
  margin-left: 0;
  margin-right: 0;
}

Most of the browsers will display the <h4> element with the following by default value(s)

h4 {
  display: block;
  font-weight: bold;
  font-size: 1em;
  margin-top: 1.33em;
  margin-bottom: 1.33em;
  margin-left: 0;
  margin-right: 0;
}

Most of the browsers will display the <h5> element with the following by default value(s)

h5 {
  display: block;
  font-weight: bold;
  font-size: .83em;
  margin-top: 1.67em;
  margin-bottom: 1.67em;
  margin-left: 0;
  margin-right: 0;
}

Most of the browsers will display the <h6> element with the following by default value(s)

h6 {
  display: block;
  font-weight: bold;
  font-size: .67em;
  margin-top: 2.33em;
  margin-bottom: 2.33em;
  margin-left: 0;
  margin-right: 0;
}