The <h3> element is used to create a smaller sub-heading on a webpage. It helps break down sections even further, making your content easy to scan and understand.
While <h2> is used for major sections, <h3> is great for sub-sections or specific topics inside a section. Think of <h3> like sub-topics inside a chapter — it keeps your content organised and structured for readers and search engines. You can use multiple <h3> headings wherever you need more detail and clarity.
Understaning the layout of the <h3> Element
| Start tag | Element content | End tag |
|---|---|---|
| <h3> | Top Countries to Visit | </h3> |
📘 Example Code
Below is an HTML example showing a title, a section heading, and a smaller sub-heading underneath:
💡 This is what the code looks like inside an editor
🖥️ What This Will Look Like in a Browser
✅ Example output you would see on a webpage:
🧪 Time to Practise!
Now it’s your turn to write your own <h3> sub-heading.
Try this example first:
<h3>Best Street Foods to Try</h3>
What To Do
✅ Type the code above in the editor below
✅ Click Test Code to see your result
✅ You can change the text and experiment with new examples
✅ Try adding a <p> below your <h3> to describe your topic
Tip 💡
Use <h3> headings when you want to introduce smaller topics inside a section.
They make your web pages clean, organised, and easy to follow — just like professional websites.
Keep practising and you’re building real web development skills, one tag at a time! 🚀
