Bootstrap Headings

• In Bootstrap, there are six levels of headings ranging from h1 to h6.
• These headings are used to provide structure and hierarchy to the content on a webpage.

Syntax

To use Bootstrap headings, just add the appropriate class to the HTML tag, like this:

<h1 class="display-1">Heading 1</h1>
<h2 class="display-2">Heading 2</h2>
<h3 class="display-3">Heading 3</h3>
<h4 class="display-4">Heading 4</h4>
<h5 class="display-5">Heading 5</h5>
<h6 class="display-6">Heading 6</h6>

Explanation

In the code above, we used the display classes to apply different styles to the headings. Here's an overview of the available display classes:

• display-1: The largest and boldest heading size.
• display-2: A slightly smaller size than display-1.
• display-3: Used for section headings or titles.
• display-4: The default size for headings in Bootstrap.
• display-5: A slightly smaller size than display-4.
• display-6: The smallest heading size.

Use

Headings are important for providing structure and hierarchy to the content on a webpage. They can also help with SEO by giving search engines an idea of what the page is about. You can use Bootstrap headings to create a consistent and visually appealing structure for your webpage.

Important Points

• Bootstrap has six levels of headings, ranging from h1 to h6.
• You can apply different styles to headings using the display classes.
• Headings provide structure and hierarchy to webpage content and can help with SEO.

Summary

Bootstrap headings are a useful tool for creating a structured and visually appealing webpage. By using different levels of headings and applying the appropriate display classes, you can give your webpage a consistent and professional look.