HTML Headings
Creating titles and subtitles for your web pages
📰 What are HTML Headings?
HTML headings are used to create titles and subtitles on web pages. There are six levels of headings, from <h1> (largest) to <h6> (smallest).
<h1>Main Title</h1>
<h2>Section Title</h2>
<h3>Subsection Title</h3>
<h4>Sub-subsection Title</h4>
<h5>Minor Heading</h5>
<h6>Smallest Heading</h6>
Output:
Main Title
Section Title
Subsection Title
Sub-subsection Title
Minor Heading
Smallest Heading
Heading Hierarchy
<h1>
Main page title (largest)
<h1>Welcome to My Website</h1><h2>
Major section headings
<h2>About Us</h2><h3>
Subsection headings
<h3>Our Services</h3><h4> - <h6>
Smaller headings for details
<h4>Contact Info</h4>🔹 Heading Best Practices
Follow these guidelines for proper heading usage:
<!-- Good heading structure -->
<h1>My Blog</h1>
<h2>Latest Posts</h2>
<h3>How to Learn HTML</h3>
<h3>CSS Tips and Tricks</h3>
<h2>About the Author</h2>
<h3>Background</h3>
<h3>Contact Information</h3>Heading Rules:
- Use only one <h1> per page
- Don't skip heading levels (h1 → h3)
- Use headings for structure, not styling
- Keep headings descriptive and concise
🔹 Styling Headings
You can style headings with CSS or inline styles:
<h1 style="color: blue; text-align: center;">Blue Centered Title</h1>
<h2 style="color: red; font-family: Arial;">Red Arial Heading</h2>
<h3 style="background-color: yellow; padding: 10px;">Highlighted Heading</h3>