The HTML <section>
element represents a generic section of a document, i.e., a thematic grouping of content, typically with a heading. Each <section>
should be identified, typically by including a heading (<h1>
-<h6>
element) as a child of the <section>
element.
Usage notes :
- If it makes sense to separately syndicate the content of a
<section>
element, use an<article>
element instead. - Do not use the
<section>
element as a generic container; this is what<div>
is for, especially when the sectioning is only for styling purposes. A rule of thumb is that a section should logically appear in the outline of a document.
Content categories | Flow content, Sectioning content, palpable content. |
---|---|
Permitted content | Flow content. |
Tag omission | None, both the starting and ending tag are mandatory. |
Permitted parent elements | Any element that accepts flow content. Note that a <section> element must not be a descendant of an <address> element. |
DOM interface | HTMLElement |
AttributesEdit
This element only includes the global attributes.
ExamplesEdit
<section>
<h1>Heading</h1>
<p>Bunch of awesome content</p>
</section>
Example 2Edit
Before
<div>
<h2>Heading</h2>
<img src="bird.jpg" alt="bird">
</div>
After
<section>
<h2>Heading</h2>
<img src="bird.jpg" alt="bird">
</section>
SpecificationsEdit
Specification | Status | Comments |
---|---|---|
WHATWG HTML Living Standard The definition of '<section>' in that specification. |
Living Standard | |
HTML5.1 The definition of '<section>' in that specification. |
Working Draft | |
HTML5 The definition of '<section>' in that specification. |
Recommendation |
Browser compatibilityEdit
See alsoEdit
Document Tags and Contributors
Tags:
Contributors to this page:
jsx,
teoli,
Sebastianz,
Jeremie,
MusikAnimal,
georgebatalinski,
SteveFaulkner,
kscarfone,
justleroy,
ethertank,
tregagnon,
Sheppy,
pepita96,
medicdude,
dhodder,
fscholz,
McGurk,
hobophobe,
jswisher
Last updated by:
jsx,