Path // www.yourhtmlsource.com → Reference → <h4>

<h4>

The <h4> element represents a fourth-level heading in the document's heading hierarchy. It is used for sub-subsections within an <h3> section, providing detailed organization for complex or lengthy content. This level of nesting is common in technical documentation, academic papers, and comprehensive guides.

Page Navigation:
Syntax | Attributes | Examples | When to Use | Related Elements

This page was last updated on 2025-11-17

Syntax

<h4>Sub-subsection Title</h4>

Attributes

class - CSS class name
id - Unique identifier for linking
style - Inline CSS styles
title - Advisory information
lang - Language of the heading

Examples

Detailed subsection:

<h3>JavaScript Functions</h3>
<h4>Function Declaration</h4>
<p>Syntax and examples...</p>
<h4>Function Expression</h4>
<p>Syntax and examples...</p>
<h4>Arrow Functions</h4>
<p>ES6 arrow function syntax...</p>

Technical documentation structure:

<h2>API Reference</h2>
<h3>User Endpoints</h3>
<h4>GET /users</h4>
<p>Returns list of users...</p>
<h4>POST /users</h4>
<p>Creates a new user...</p>

With even deeper nesting:

<h4>Configuration Options</h4>
<h5>Required Settings</h5>
<p>Settings that must be configured...</p>
<h5>Optional Settings</h5>
<p>Additional customization...</p>

When to Use

Use <h4> when you need to divide an <h3> section into more specific topics. This level is particularly useful for technical documentation, product specifications, or any content that requires detailed categorization. For instance, within an <h3> about "Database Operations," you might have <h4> elements for "Read Operations," "Write Operations," and "Delete Operations."

When you reach <h4> level, consider whether your content structure is becoming too deeply nested. While this level is perfectly valid, excessive nesting can make content difficult to navigate. If you find yourself frequently using <h5> and <h6>, it may be worth restructuring your content into separate pages or sections.

Maintain proper hierarchy by ensuring <h4> always appears within an <h3> context. Screen readers announce "heading level 4," so users relying on assistive technology will understand this is a deeply nested subsection. Consistent hierarchy helps all users navigate complex documents effectively.