Bootstrap 4 Text/Typography
Bootstrap 4 Text/Typography:
<h1> - <h6>
Bootstrap 4 HTML headings styles (h1 - h6)
- <div class="container">
- <h1>h1 heading</h1>
- <h2>h2 heading</h2>
- <h3>h3 heading</h3>
- <h4>h4 heading</h4>
- <h5>h5 heading</h5>
- <h6>h6 heading</h6>
- </div>
Output:
h1 heading
h2 heading
h3 heading
h4 heading
h5 heading
h6 heading
Display Headings Bootstrap 4 styles:
Example:
larger font-size and lighter font-weight. there are four (4) classes to choose from: .display-1, display-2, display-3, display-4
- <div class="container">
- <h1 class="display-1">h1 heading</h1>
- <h2 class="display-2">h2 heading</h2>
- <h3 class="display-3">h3 heading</h3>
- <h4 class="display-4">h4 heading</h4>
- </div>
Output:
h1 heading
h2 heading
h3 heading
h4 heading
HTML <mark> tag
<mark> tag, mark tag, html mark tag, mark html, mark tag.
<mark> tag is all element mark
Example:
- <div class="container">
- <p>This is <mark>mark</mark> tag</p>
- </div>
Output:
This is mark tag
HTML <small> tag
<small> tag, small tag, html small tag, small html, small tag.
HTML <small>
element defines smaller text:
Example:
- <div class="container">
- <h1>Hello <small>This is small tag</small></h1>
- </div>
Output:
Hello This is small tag
HTML <del> tag
<del> tag, del tag, html del tag, del html, del tag.
HTML <
del>
element defines smaller text:
Example:
- <div class="container">
- <p>This is del <del>tag</del> test.</p>
- </div>
Output:
This is del tag test.
abbr Tag:
This tag allows us to give the full-length name of an abbreviation which we use in a web page.
Example:
- <div class="container">
- <p>I Am <ABBR title="World Wide Web">WEB</ABBR> Designer</P>
- </div>
Output:
I Am WEB Designer
Bootstrap 4 heading tag, Bootstrap 4 display class, Bootstrap 4 mark tag, Bootstrap 4 small tag, Bootstrap 4 del tag, Bootstrap 4 abbr tag,
Thank you..........
shelleyakter
So nice post, Thank You.