私の理解では、すべてのBootstrapスタイルの要素は要素内に存在する必要があり<div class="container">ます。しかし、複数の「コンテナ」が存在するBootstrapの例を時々目にします。
<div class="container">
<!-- Blah, GUI stuff, blah -->
</div>
...
<div class="container">
<!-- Blah, more GUI stuff, blah -->
</div>
私の質問：
回答:
ページの一部のセクションはビューポートの幅全体に広がり、他のセクションは広がりません。一部の背景は全幅になりますが、コンテンツは全幅になりません。
この例は、ビューポートの全幅である背景画像または色を持っているが、その中のコンテンツ、フォームなどが、.container任意のビューポート幅でを超えないフィーチャー領域です。
ネストしない.containerか.container-fluid、ドキュメントを参照してください。それは必要はありません。
ドキュメント：ブートストラップには、サイトのコンテンツをラップしてグリッドシステムを格納するための包含要素が必要です。プロジェクトで使用する2つのコンテナのいずれかを選択できます。パディングなどにより、どちらのコンテナもネストできないことに注意してください[.containerと.container-fluidがネストされないことを意味するわけでもありません]。
.container-fluidメインサイトがの中にある間、私はしばしばある種のナビゲーションバーやバナーのようなものを持っています.container。
.container-fluid、パネル内の行/列を囲むクラスが必要です。そうしないと、水平スクロールバーが表示されます（パネル内のオーバーフローが非表示に設定されていない限り、それは望ましくないかもしれません。内部に大量のデータがある場合はスクロールバーが必要な場合があります。幅の広いテーブルなど）。
一部の人が言ったこととは異なり、container-fluid内部にネストすることができますcontainer。公式のブートストラップWebサイトにも例があります。
containerネストが含まれていますcontainer-fluid：view-source：getbootstrap.com/docs/3.3/examples/navbar
4.3ドキュメントのレイアウトセクションhttps://getbootstrap.com/docs/4.3/layout/overview/#containersに、次のように記載されています。
コンテナはネストできますが、ほとんどのレイアウトではネストされたコンテナは必要ありません。
パディングなどについて他の人が言っていることに注意してください。
実際、それは完全に設計者の要件に依存します。
行の全幅が必要になる場合があります（つまり、個別のコンテナクラスなしで実現できるビューポートまたは表示部分のストリップを意味します）
http://binarytheme.com/demos?theme=bootsrap-landing-page-blue
上記のテンプレートの例を参照して理解してください
時間を節約してCss-gridに切り替えてください、ネイティブCSSグリッド。
ブートストラップコンテナには制限があります。12列の制限、10ピクセルのパディングの課題を探す場合、それに加えて、ユーザーが自分のマシンにダウンロードする必要があるネイティブ（CSS組み込み）ではなく、その数に加えてあなたが処理する必要があるダイビングの。
これらすべてを念頭に置いて、CSSグリッドに切り替えてみてください 。ここから始めるのが良い遊び場です。
CSSグリッドの短所は、まだIEと互換性がないということです。