Bootstrap Jumbotron

In this article we will cover the most important feature “Jumbotron” of Bootstrap. Jumbotron optionally increases the size of headings and add a lot of margins for content on landing page as like its name Jumbotron. To use the Jumbotron follow the following steps and then code.

• First of add a container <div> with the class of .jumbotron.

• Then add a larger <h1> in the jumbotron div, here the font-weight of <h1> is reduced to 200px.

The following example demonstrates this:

To make thejumbotron without rounded corners and full width use the .jumbotron class outside all .container classes and instead inside .container within as shown in the following example: