Headings

Download html eBook

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 h1h6 element must have both a start tag and an end tag.1

  • h1h6 elements are block level elements by default (CSS style: display: block).2

  • h1h6 elements should not be confused with the section element

  • Heading tags (h1h6) 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 h1h6 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.

Related Examples

Stats

228 Contributors: 13
Thursday, December 29, 2016
Licensed under: CC-BY-SA

Not affiliated with Stack Overflow
Rip Tutorial: info@zzzprojects.com

Download eBook