From the course: Bootstrap 4 Essential Training

Unlock the full course today

Join today to access over 22,600 courses taught by industry experts or purchase this course individually.

Add a jumbotron

Add a jumbotron - Bootstrap Tutorial

From the course: Bootstrap 4 Essential Training

Start my 1-month free trial

Add a jumbotron

- The jumbotron is a component for a highlighted section of content and it's commonly used at the top of many websites. It's really easy to do with Bootstrap and this current version has a couple of options for you. So there are a few classes that you can use here. The main one that goes in the container is called, just of course, the jumbotron class and then you have the option to create a jumbotron-fluid, which is a slightly different version. Takes up the entire space of the parent. Now if you want something to align inside the jumbotron, you'll need to place it inside a container and then, of course, you can add other styles as needed. So let's talk a look at a simple example of this. Here we have a section at the top. So traditionally jumbotrons are something that goes at the top of the screen so we can put them right here in the header. And if we wanted to we can give this a class of jumbotron. This gives the header now a rounded edge and it looks pretty good. And also, the text…

Contents