HTML & CSS reference

<section>

A thematic section of the page with its own heading.

Syntax

<section><h2>Title</h2>…</section>

Examples

Sections of a landing page:

<section>
  <h2>Our menu</h2>
  <p>Espresso, latte, cappuccino.</p>
</section>
<section>
  <h2>Where to find us</h2>
  <p>12 Baker Street.</p>
</section>

Notes

A <section> almost always has a heading. If the block is needed only for styling and has no heading, use a <div>.

See also

<article> — A self-contained piece that makes sense on its own: an article, a post, a review, a product card.
<div> — A block container without meaning: groups elements for styling and layout.
<h1>–<h6> — Headings of six levels: `<h1>` is the main one, `<h6>` the smallest.

In the tutorial

Semantic markup — The neutral div and span and the meaningful header, nav, main, article, section, aside and footer tags for page structure.