Source

Jumbotron

Component lleuger i flexible per mostrar el contingut d'estil de la unitat d'heroi.

Un component lleuger i flexible que, opcionalment, pot ampliar tota la finestra gràfica per mostrar missatges de màrqueting clau al vostre lloc.

Hola món!

Es tracta d'una unitat d'heroi senzilla, un component senzill d'estil jumbotron per cridar l'atenció addicional sobre el contingut o la informació destacats.


Utilitza classes d'utilitat per a la tipografia i l'espaiat per espaiar el contingut dins del contenidor més gran.

Aprèn més

<div class="jumbotron">
  <h1 class="display-4">Hello, world!</h1>
  <p class="lead">This is a simple hero unit, a simple jumbotron-style component for calling extra attention to featured content or information.</p>
  <hr class="my-4">
  <p>It uses utility classes for typography and spacing to space content out within the larger container.</p>
  <p class="lead">
    <a class="btn btn-primary btn-lg" href="#" role="button">Learn more</a>
  </p>
</div>

Per fer que el jumbotron sigui d'amplada completa i sense cantonades arrodonides, afegiu la .jumbotron-fluidclasse modificadora i afegiu a .containero .container-fluiddins.

Jumbotron fluid

Es tracta d'un jumbotron modificat que ocupa tot l'espai horitzontal del seu pare.

<div class="jumbotron jumbotron-fluid">
  <div class="container">
    <h1 class="display-4">Fluid jumbotron</h1>
    <p class="lead">This is a modified jumbotron that occupies the entire horizontal space of its parent.</p>
  </div>
</div>