What is Bootstrap custom Jumbotron?

A jumbotron indicates a big box for calling extra attention to some special content or information. A jumbotron is displayed as a grey box with rounded corners. It also enlarges the font sizes of the text inside it.

Bootstrap Jumbotron is a responsive component whose main goal is to draw the visitor’s attention or highlight a special piece of information. Inside a Jumbotron, you can make use of almost any other Bootstrap code to further increase its engagement value.

Uses of Jumbotron:

  • Image showcase
  • Highlighting content
  • Introduction to a Certain Topic

Tip: Inside a jumbotron, you can put nearly any valid HTML, including other Bootstrap elements/classes.

Use a <div> element with class jumbotron to create a jumbotron:

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

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