Back to Course
BootStrap
0% Complete
0/39 Steps
-
Introduction to BootstrapWhat is Bootstrap ?
-
Why Bootstrap ?
-
Bootstrap Setup
-
Customizing Install
-
Responsive Design
-
Container class
-
GridGrid System
-
Bootstrap Grid Column
-
Dynamic Layouts
-
Utility Classes
-
Navigation ComponentsNavs
-
Navbars
-
Page ComponentsHeaders
-
Panels
-
ListGroups
-
Breadcrumbs
-
Labels
-
Buttons
-
Glypgicons
-
Wells
-
FormsCreating forms
-
Inline & horizontal forms
-
Form Validation
-
Bootstrap PluginsAlert Messages
-
Buttons group
-
Scroll Spy
-
Tabs
-
Collapse
-
Modal
-
Customer PluginsBootbox.js
-
DateTime Picker
-
Font Awesome
-
Off-Canvas
-
Image Gallery
-
Social Buttons
-
Sweet Alert
-
ButtonButtons
-
Button Group Button
-
Button Method
Participants2254
Bootstrap has created an HTML component to be used as a page header.
Example:
<!DOCTYPE html>
<html lang="en">
<head>
<link rel="stylesheet"
href="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css">
</head>
<body>
<div class="container">
<div class="page-header">
<h1>Chapter 4</h1>
</div>
</div>
</body>
</html>
Output:

Page subtitle
To add a subtitle beside the title of the page, we can put it inside the same <h1>
wrapped inside a <small></small>
tag.
<!DOCTYPE html>
<html lang="en">
<head>
<link rel="stylesheet"
href="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css">
</head>
<body>
<div class="container">
<div class="page-header">
<h1>Chapter 4 <small>Bootstrap Page Components </small></h1>
</div>
</div>
</body>
</html>
Output:
