Is it possible to create html tags h7, h8, h9 and

Question

This question already has an answer here:

• how to make a new heading (number) tag? 5 answers
• How to create custom tags for html [closed] 7 answers

Here's a novice question. Is it possible to create more heading styles like h7, h8, and so on. I am just wondering if it possible to have more than 6 different types of headings on a website.

Answer 1

You can create any element you want on a page, but I think your question is whether it will be interpreted correctly by a user agent like a browser. Browsers will allow you to create, apply styles to, and access arbitrarily-created elements on the DOM regardless of whether they conform to the spec implied by your declared DOCTYPE.

However, in general, it's best to avoid creating deeply nested structures; users find such hierarchies difficult to follow. In addition, as other answers linked in the comments have pointed out, there may be unintended consequences with page accessibility, SEO, or script compatibility. I have yet to find a use case that actually needs such deeply nested hierarchies, except when posting long legal documents as a single HTML page.

Answer 2

The HTML spec defines 6 headings. Browsers recognize 6 headings. If you start using <h7> and so on, then you'll be using an invalid element.

If you find yourself needing an <h7> then you should probably take a look at how you're structuring your site. Not every single title deserves a heading element.

Answer 3

Generally speaking you can create as many headings as you want but they must be defined as classes. So if you are looking at making more than 6 headings for organization purposes do something like :

.h7{
    color: #111111;
    font-size: 16px;
    text-transform: uppercase;
 }

 <p class="h7"> I'm an extra heading </p>