Page 73 - HTML5

Chapter 15: Headings

Introduction

HTML provides not only plain paragraph tags, but six separate header tags to indicate headings of
various sizes and thicknesses. Enumerated as heading 1 through heading 6, heading 1 has the
largest and thickest text while heading 6 is the smallest and thinnest, down to the paragraph level.
This topic details proper usage of these tags.

Syntax

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

Remarks

• An h1–h6 element must have both a start tag and an end tag. 1

• h1–h6 elements are block level elements by default (CSS style: display: block). 2

• h1–h6 elements should not be confused with the section element

• Heading tags (h1–h6) are not related to the head tag.

• Permitted Content: phrasing content

• The different CSS-styles for headings differ usually in font-size and margin. The following
CSS-settings for h1–h6 elements can serve as an orientation (characterized as 'informative'
by the W3C)

• Search engine spiders (the code that adds a page to a search engine) automatically pays
more attention to higher importance (h1 has most, h2 has less, h3 has even less, ...)
headings to discern what a page is about.

Examples

Using Headings

Headings can be used to describe the topic they precede and they are defined with the <h1> to
<h6> tags. Headings support all the global attributes.

• <h1> defines the most important heading.

https://riptutorial.com/ 57