Create responsive website with Bootstrap

Bootstrap tutorial includes all topics such as jumbotron, table, button, grid, form, image, alert, wells, container, carousel, panels, glyphicon, badges, labels, progress bar, pagination, pager, list group, dropdown, collapse,tabs, pills, navbar, inputs, modals, tooltip, popover and scrollspy.

Bootstrap Jumbotron


A Bootstrap jumbotron specifies a big box for getting extra attention to some special content or information. It is displayed as a grey box with rounded corners. It can also enlarge the font sizes of the text inside it.

The class .jumbotron within the <div> element is used to create a jumbotron.


Jumbotron Inside Container

Place the jumbotron inside the <div class="container"> if you want the jumbotron to NOT extend to the edge of the screen:

<div class="container">
  <div class="jumbotron">
    <h1>Bootstrap Jumbotron</h1>
    <p>Bootstrap is the most popular HTML, CSS, and JS framework for developing
    responsive web sites.</p>
 </div>
</div>

Jumbotron Outside Container

Place the jumbotron outside the <div class="container"> if you want the jumbotron to extend to the screen edges

<div class="jumbotron">
    <h1>Bootstrap Jumbotron</h1>
    <p>Bootstrap is the most popular HTML, CSS, and JS framework for developing
    responsive web sites.</p>
 </div>