Bootstrap Display Shortcode
Traditional heading elements are designed to work best in the meat of your page content. When you need a heading to stand out, consider using a display heading—a larger, slightly more opinionated heading style.
Donate
Become a backer or sponsor to support our work.
On this page
Sponsors
Syntax
1{{% bs/display %}}
2HEADING
3{{% /bs/display %}}
Parameters
level
| Name | Context | Type | Required | Default | Since | Example |
|---|---|---|---|---|---|---|
level | - | number | - | 1 | - | - |
The level of display headings.
class
| Name | Context | Type | Required | Default | Since | Example |
|---|---|---|---|---|---|---|
class | - | string | - | - | - | - |
Used to add extra CSS classes.
Examples
Source
1{{% bs/display %}}
2Display 1
3{{% /bs/display %}}
4
5{{% bs/display 2 %}}
6Display 2
7{{% /bs/display %}}
8
9{{% bs/display 3 %}}
10Display 3
11{{% /bs/display %}}
12
13{{% bs/display 4 %}}
14Display 4
15{{% /bs/display %}}
16
17{{% bs/display 5 %}}
18Display 5
19{{% /bs/display %}}
20
21{{% bs/display 6 %}}
22Display 6
23{{% /bs/display %}}
24
25{{% bs/display 1 "text-primary" %}}
26Display with extra classes.
27{{% /bs/display %}}
28
29{{% bs/display level=6 class="text-success" %}}
30Display 6 with extra classes via named parameters.
31{{% /bs/display %}}Result