Jumbotron in Bootstrap, displaying content on the web

Refer to the following article of Taimienphi.vn to learn about Jumbotron in Bootstrap. Also readers can refer to some other Bootstrap lessons already on Taimienphi.vn to learn more about Badge in Bootstrap.

Learn about Jumbotron in Bootstrap

1. Display web content with Jumbotron

Jumbotron in Bootstrap is a great way to display key content or information on web pages. We only need to wrap the featured content, such as title, description, … in the element div and apply the class .jumbotron up there.

For example: The following example illustrates how to display web page content with Jumbotron in Bootstrap:

The output will look like the following:

2. Create a web page that covers the entire viewport

To create a Jumbotron without rounded corners, covering the entire viewport width, we just need to place the Jumbotron outside all the containing elements, add a modified layer .jumbotron-fluid on it, and add layers .container or class .container-fluid In particular, refer to the example below:

The output will look like the following:

The above lesson Taimienphi.vn has just introduced you to Jumbotron in Bootstrap. Also readers can refer to some other lessons already on Taimienphi.vn to learn more about creating a navigation bar in Bootstrap offline.

https://thuthuat.taimienphi.vn/jumbotron-in-bootstrap-51212n.aspx
In the next lesson, Taimienphi.vn will introduce you more about classes Helper in Bootstrap.