A bootstrap jumbotron is a big grey box used to indicate extra attention to some special text or information. This jumbotron displayed as a grey box with rounded corners. It can also enlarge the font sizes of the text inside it.
You can put any valid HTML code or other Bootstrap elements or classes inside a jumbotron. The class .jumbotron within the <div> element is used to create a jumbotron.
Jumbotron Inside Container:
The Bootstrap 4 jumbotron component provides an excellent way to showcase the key content or information on a web page. To create a jumbotron, apply the .jumbotron class to the <div> element that represents the jumbotron.
Jumbotron Outside Container:
Normally, it is used when you want the jumbotron to extend to the screen edges. Add a jumbotron class outside the container.
Full-width Jumbotron:
To create a jumbotron that covers the full width of the viewport and without rounded corners, places it outside all the containers, add the .jumbotron-fluid modifier class on it, and add a .container or .container-fluid within it, as shown in the below example: