Latest web development tutorials

Bootstrap large screen

Another feature of this chapter will explain Bootstrap support, large screen (Jumbotron). As the name suggests this component can increase the size of the title, and add more content from outside of the landing page (margin). To use the large screen (Jumbotron) as follows:

  • Create aclass .jumbotron with. Container <div>.
  • Apart from more <h1>, font weightfont-weightwas reduced to 200px.

The following example illustrates this point:

Examples

<Div class = "container"> <Div class = "jumbotron"> <H1> Welcome Page! </ H1> <P> This is an example of a large screen (Jumbotron) of. </ P> <P> <a class = "btn btn-primary btn -lg" role = "button"> Learn more </ a> </ P> </ Div> </ Div>

try it"

The results are as follows:

Large screen (Jumbotron)

In order to obtain the full width and does not occupy large screen with rounded corners, use.jumbotron class in all .container classoutside, as shown in the following examples:

Examples

<Div class = "jumbotron"> <Div class = "container"> <H1> Welcome Page! </ H1> <P> This is an example of a large screen (Jumbotron) of. </ P> <P> <a class = "btn btn-primary btn -lg" role = "button"> Learn more </ a> </ P> </ Div> </ Div>

try it"

The results are as follows:

The full width of the large screen (Jumbotron)