Bootstrap Jumbotron
Jumbotron defines a big box, which can be used for getting extra attention. It increase the size of heading, text and add a lot of margin inside it. To create a jumbotron you have to use .jumbotron class within a <div> tag.
Example:
<div class="container">
<div class="jumbotron">
<h1> Welcome to Jumbotron </h1>
<p> This is an example of jumbotron. </p>
<p> Jumbotron defines a big box, which can be used for getting extra attention. </p>
</div>
</div>
<div class="jumbotron">
<h1> Welcome to Jumbotron </h1>
<p> This is an example of jumbotron. </p>
<p> Jumbotron defines a big box, which can be used for getting extra attention. </p>
</div>
</div>
Run Example
Full Width Jumbotron
If you want to create a jumbotron with full width and except rounded corners place the .jumbotron class outside and the .container class inside.
Example:
<div class="jumbotron">
<h1> Welcome to Jumbotron </h1>
<p> Jumbotron with full width </p>
<div class="container">
<p> This is an example of jumbotron. </p>
<p> Jumbotron defines a big box, which can be used for getting extra attention. </p>
</div>
</div>
<h1> Welcome to Jumbotron </h1>
<p> Jumbotron with full width </p>
<div class="container">
<p> This is an example of jumbotron. </p>
<p> Jumbotron defines a big box, which can be used for getting extra attention. </p>
</div>
</div>
Run Example