HTML Tags

HTML <section> Tag

The <section> tag defines a thematic grouping of content on a webpage.
It is used to organize content into sections with a common heading or purpose, such as chapters, tabs, or topic areas.
<section> is often used along with headings (<h1>-<h6>) to define logical blocks of content.

Syntax

html

<section>
  <!-- Thematically related content with heading -->
</section>

Attributes

Attribute	Description
id	Assigns a unique identifier.
class	Specifies one or more class names.
style	Inline CSS styling.
title	Provides additional information about the element.

Example

html

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Section Tag Example</title>
</head>
<body>
  <h1>Website Overview</h1>

  <section style="border: 1px solid #ccc; padding: 15px; margin-bottom: 20px;">
    <h2>About Us</h2>
    <p>We are a team of web developers specializing in HTML, CSS, and JavaScript.</p>
  </section>

  <section style="border: 1px solid #ccc; padding: 15px;">
    <h2>Our Services</h2>
    <p>We provide website design, development, and maintenance services for businesses.</p>
  </section>
</body>
</html>

Output

Browser Output

html

You will see distinct sections with borders and headings.
Each <section> visually groups related content together for clarity and better structure.
Use our TryIt Editor to experiment with multiple sections and headings.

Browser Support

Chrome	Edge	Firefox	Safari	Opera	IE9+
Yes	Yes	Yes	Yes	Yes	Yes

All major browsers support <section> tag.

Notes

<section> is semantic and should contain a heading to describe its content.
Useful for grouping related content logically.
Can be nested inside <main> or <article> for structured layout.
Improves accessibility and SEO by providing clear content divisions.

Conclusion

The <section> tag is ideal for organizing thematic content on a webpage.
It provides semantic meaning, improves readability, and helps search engines understand content structure.

PreviousHTML <article> Tag NextHTML <aside> Tag