Per usare la griglia di Bootstrap bisogna sempre essere dentro a un container.

Container

<div class="container">
  <!-- Contenuto -->
</div>

Imposta una max-width in corrispondenza di ogni breakpoint:

In uno schermo Medium quindi il container avrà una larghezza fissa di 720px, mentre in uno schermo Large avrà una larghezza fissa di 960px.
Questo ci permette tra le altre cose  di ottimizzare le immagini da inserire nella nostra pagina (troppo piccole verrebbero sgranate, troppo grandi rallenterebbero il caricamento della pagina).

Container-{breakpoint}

<div class="container-sm">100% wide until small breakpoint</div>
<div class="container-md">100% wide until medium breakpoint</div>
<div class="container-lg">100% wide until large breakpoint</div>
<div class="container-xl">100% wide until extra large breakpoint</div>
<div class="container-xxl">100% wide until extra extra large breakpoint</div>

Si adatta al 100% della larghezza fino al breakpoint specificato:

Ad esempio un container-lg si adatterà al 100% della larghezza fino agli schermi Medium. Dai Large in sù invece si comporterà come un normale Container.

Container-fluid

<div class="container-fluid">
  ...
</div>