Comprehensive analysis of how to use Bootstrap layout (title)_javascript skills

Bootstrap is the same as an ordinary HTML page. The tags

to

are used to define the title. However, Bootstrap overrides its default style and uses it to display the same effect in all browsers. Specifically The defined rules can be shown in the following table:

<!--Bootstrap中的标题-->
<h1>Bootstrap标题一</h1>
<h2>Bootstrap标题二</h2>
<h3>Bootstrap标题三</h3>
<h4>Bootstrap标题四</h4>
<h5>Bootstrap标题五</h5>
<h6>Bootstrap标题六</h6>

<!--Bootstrap中让非标题元素和标题使用相同的样式-->
<div class="h1">Bootstrap标题一</div>
<div class="h2">Bootstrap标题二</div>
<div class="h3">Bootstrap标题三</div>
<div class="h4">Bootstrap标题四</div>
<div class="h5">Bootstrap标题五</div>
<div class="h6">Bootstrap标题六</div>

The effect is as follows:

In addition, in web production, we often encounter a title followed by a line of small subtitles. In Bootstrap, he also considered this typesetting effect and used the tag to create subtitles. This subtitle has some unique styling of its own:

1. The line height is all 1, and the font-weight is set to normal to become a regular effect (not bold), and the color is set to gray (#999).

2. Since the text font in is in h1~h3, its size is set to 65% of the current font size; while the font size in h4~h6 is set to 75% of the current font size;

<!--Bootstrap中使用了<small>标签来制作副标题-->
<h1>Bootstrap标题一<small>我是副标题</small></h1>
<h2>Bootstrap标题二<small>我是副标题</small></h2>
<h3>Bootstrap标题三<small>我是副标题</small></h3>
<h4>Bootstrap标题四<small>我是副标题</small></h4>
<h5>Bootstrap标题五<small>我是副标题</small></h5>
<h6>Bootstrap标题六<small>我是副标题</small></h6>

The effect is as follows:

The above is a detailed introduction to Bootstrap title layout. More content will be updated in the future. I hope you will continue to pay attention.