YouTip LogoYouTip

Bootstrap Jumbotron

# Bootstrap Jumbotron This chapter will explain another feature supported by Bootstrap, the Jumbotron. As the name suggests, this component can increase the size of headings and add more margin to landing page content. The steps to use the Jumbotron are as follows: * Create a container `
` with the class **.jumbotron**. * Besides a larger `

`, the font-weight _font-weight_ is reduced to 200. The following example demonstrates this: ## Example

Welcome to the landing page!

This is an example of a Jumbotron.

Learn more

[Try it Β»](#) The result is as follows: ![Image 3: Jumbotron](#) To get a full-width Jumbotron without rounded corners, use the **.jumbotron** class outside of all **.container** classes, as shown in the following example: ## Example

Welcome to the landing page!

This is an example of a Jumbotron.

Learn more

[Try it Β»](#) The result is as follows: ![Image 4: Full-width Jumbotron](#)

← Bootstrap Page HeaderBootstrap Badges β†’