.jumbotron classı bazı özel içerikler veya bilgileri kullanıcı dikkatini çekecek şekilde sunmak için büyük bir kutu oluşturur. Varsayılan da jumbotron köşeleri yuvarlatılmış büyük gri bir kutu olarak görüntülenir.  Aynı zamanda içinde yer alan metin boyutlarını büyütür.

Şekil *.1: .jumbotron classının kullanımı

<div class="container">
  <div class="jumbotron">
    <h1>Bootstrap Tutorial</h1> 
    <p>Bootstrap is the most popular HTML, CSS, and JS framework for developing
    responsive, mobile-first projects on the web.</p> 
  </div>
  <p>This is some text.</p> 
  <p>This is another text.</p> 
</div>

Şekil * .2: .jumbotron classının kullanımı ile ortaya çıkan sonuç

Konteyner Dışında Jumbotron Kullanımı

Jumbotronun ekran genişliğinin tamamını kaplanması isteniyorsa bu durumda konteyner dışında kullanılır.

Şekil *.3: .jumbotron classının konteyner dışında kullanımı

<div class="jumbotron">
  <h1>Bootstrap Tutorial</h1> 
  <p>Bootstrap is the most popular HTML, CSS, and JS framework for developing responsive,
  mobile-first projects on the web.</p> 
</div>
<div class="container">
  <p>This is some text.</p> 
  <p>This is another text.</p> 
</div>

Şekil *.4 : .jumbotron classının konteyner dışında kullanılması ile ortaya çıkan sonuç