Home HTML CSS JAVASCRIPT BOOTSTRAP Python Docker ML tutorial About us Privacy policy

HTML Headings

HTML Headings


  • In HTML headings are declare as a title or sub-title of HTML document.
  • We define headings inside <h1> to <h6> tag.
  • The largest heading is <h1> and smallest heading is <h6> , In HTML document.
  • If you want to use Main heading in our document then you should use <h1> heading,for sub-heading we use <h2>,<h3>etc.
<!DOCTYPE html>
<html>
<head>
  <title>HTML Headings</title>
</head>
<body>
  <h1>Heading-1</h1>
  <h2>Heading-2</h2>
  <h3>Heading-3</h3>
  <h4>Heading-4</h4>
  <h5>Heading-5</h5>
  <h6>Heading-6</h6>

</body>
</html>

HTML headings with Nested ELements

<!DOCTYPE html>
<html>
<head>
  <title>HTML Headings</title>
</head>
<body>
  <p>First paragraph</p>
  <h1>My First Heading</h1>

  <p>Second paragraph</p>
  <h1>My second Heading</h1>

  <p>Third paragraph</p>
  <h1>My Third Heading</h1>

  <p>Fourth paragraph</p>
  <h1>My Fourth Heading</h1>

  <p>Fifth paragraph</p>
  <h1>My Fifth Heading</h1>

  <p>Sixth paragraph</p>
  <h1>My Sixth Heading</h1>

</body>
</html>

Customize Headings

We can also customize HTML headings by using style attribute of css.

<h1 style="font-size:80px;color:blue"></h1>

HTML Horizontal Tag

In HTML To draw horizontal line we use <hr> tag. It is basically use to manage the HTML content.It is very usefull tag in HTML.

<!DOCTYPE html>
<html>
<head>
  <title>Horizontal Tag</title>
</head>
<body>
  <p>Code Family</p>
  <h1>My heading</h1>
  <hr>
  <p>Code Family</p>
  <h1>Your heading</h1>

</body>
</html>