コンテナー液とコンテナー
ちょうど3.1をダウンロードして、ドキュメントで見つけました...
一番外側の
.containerを.container-fluidに変更して、固定幅グリッドレイアウトを全角レイアウトにします。
bootstrap.cssを見ると、.container-fluidは.containerと同一のようです。両方とも同じCSSを持ち、.container-fluidのすべてのインスタンスは.containerとペアになっており、すべての列クラスはパーセントで指定されています。
例をいじってみると、すべてが流動的に見えたので、違いは見られませんでした。
私はBootstrapに慣れていないので、何かが足りないと思います。誰かが少し時間をかけて私を啓発することができますか？
クイックバージョン： .containerはブートストラップ（xs、sm、md、lg）の各画面サイズに対して1つの固定幅を持ちます。 .container-fluidは、利用可能な幅に合わせて拡大されます。
containerとcontainer-fluidの違いはCSSのこれらの行から来ます：
@media (min-width: 568px) {
.container {
width: 550px;
}
}
@media (min-width: 992px) {
.container {
width: 970px;
}
}
@media (min-width: 1200px) {
.container {
width: 1170px;
}
}
Webページが表示されているビューポートの幅に応じて、containerクラスはdivに特定の固定幅を与えます。これらの行はcontainer-fluidにはいかなる形式でも存在しないため、ビューポートの幅が変わるたびにその幅が変わります。
たとえば、ブラウザウィンドウの幅が1000ピクセルだとします。最小幅の992ピクセルより大きいので、.container要素の幅は970ピクセルになります。その後、ブラウザウィンドウをゆっくり広げます。あなたの.containerの幅はあなたが1200pxに達するまで変わりません、そこでそれはそれが1170px幅にジャンプしそしてより大きなブラウザ幅のためにそのままになります。
一方、あなたの.container-fluid要素は、あなたがあなたのブラウザの幅に最小の変更さえ加えても絶えずサイズを変更します。
containerとcontainer-fluidは、グリッドに対するレスポンシブレスポンスとノンレスポンスの違いです。これは真実ではありません...言っているのは幅が固定されていないということです...全幅！
これは説明が難しいので、例を見てみましょう。
例1
container-fluid：
それで、あなたはコンテナがどのように全画面を占めるかを見ます...それはcontainer-fluidです。
それでは、もう片方の通常のcontainerを見て、プレビューの端を見てみましょう。
例2
container
今、あなたは例の中に空白を見ますか？それは固定幅containerだからです！両方の例を2つの異なるタブで開き、前後に切り替えるのがより理にかなっているかもしれません。
_編集_
さらに良いのは、両方のコンテナを同時に使用した例です。今、あなたは本当に違いを見分けることができます！
これが少し明確になったことを願っています！
.containerと.container-fluidの両方が反応します（つまり、画面の幅に基づいてレイアウトを変更します）が、方法は異なります（命名はそのようには聞こえません）。
短い答え：
.containerは飛び跳ねる/途切れがちなサイズ変更です、そして
.container-fluidは幅：100％で連続的/細かいサイズ変更です。
機能的な観点から：
.container-fluidは、ウィンドウ/ブラウザの幅をいくらでも変更してもサイズが変わりません。.containerの場合とは異なり、横に余分な空きスペースはありません。 （したがって、命名法は、「デジタル」、「離散」、「チャンク」、または「量子化」とは対照的に「流動的」です。
.containerはいくつかの幅で塊にサイズ変更されます。言い換えれば、それはスクリーン幅の異なる特定の別名 "固定"幅別の範囲になります。
意味： "固定幅"
名前の混乱がどのように発生する可能性があるかがわかります。技術的には、.containerは「固定幅」と言えますが、細かい幅ごとにサイズ変更されるわけではないという意味でのみ固定されています。サイズは変更される可能性があるため、常に特定のピクセル幅のままであるという意味で、実際には「固定」されていません。
基本的な観点から：
.container-fluidはCSSプロパティwidth: 100%;を持っているので、スクリーン幅の細分度ごとに継続的に再調整されます。
.container-fluid {
width: 100%;
}
.containerには "width = 800px"（またはem、remなど）のようなものがあり、さまざまな画面幅での特定のピクセル幅の値です。これは、画面幅が画面幅しきい値を超えると、エレメント幅が突然異なる幅にジャンプする原因となります。また、そのしきい値はCSS3メディアクエリによって管理されているため、画面幅の範囲など、さまざまな条件にさまざまなスタイルを適用できます。
@media screen and (max-width: 400px){
.container {
width: 123px;
}
}
@media screen and (min-width: 401px) and (max-width: 800px){
.container {
width: 456px;
}
}
@media screen and (min-width: 801px){
.container {
width: 789px;
}
}
超えて
メディアクエリはバックグラウンドでのブートストラップによる.containerの実装方法とまったく同じであるため、.container要素だけでなく、任意の固定幅要素をメディアクエリで応答させることができます（コードについてはJKillianの回答を参照）。
ページをビューポートサイズですべての小さな違いを伴うシェープシフトにする場合は、.container-fluidを使用します。
ページを4種類のサイズのみに変更するにしたい場合は.containerを使用します。これは"breakpoints"。としても知られています。
サイズに対応するブレークポイントは次のとおりです。
- 極小：（モバイル解像度のみ）
- 小：768px（タブレット）
- 中：992px（ラップトップ）
- 大：1200px（ラップトップ/デスクトップ）
2018年更新
ブートストラップ4
containerは5つの幅を持っています...
.container {
width: 100%;
}
@media (min-width: 576px) {
.container {
max-width: 540px;
}
}
@media (min-width: 768px) {
.container {
max-width: 720px;
}
}
@media (min-width: 992px) {
.container {
max-width: 960px;
}
}
@media (min-width: 1200px) {
.container {
max-width: 1140px;
}
}
ブートストラップ3
containerは4サイズあります。 xsスクリーン上の全幅、そしてその幅は次のメディアクエリによって異なります.
@media (min-width: 1200px) {
.container {
width: 1170px;
}
}
@media (min-width: 992px) {
.container {
width: 970px;
}
}
@media (min-width: 768px) {
.container {
width: 750px;
}
}
.containerは最大幅のピクセル値を持ち、.container-fluidは最大幅の100％です。
ウィンドウ/ブラウザの幅をいくらでも変更しても、.container-fluidのサイズは常に変わります。
.containerはメディアクエリーによって制御され、いくつかの幅で塊にサイズ変更されます（ピクセル値が指定されているので技術的には「固定幅」と言えます。レスポンシブ。）
ディスプレイの観点から見れば、.containerを使うと、ユーザーが見ているものをより細かく制御でき、サイズはサイズに関連するため、4種類のディスプレイ（ブートストラップ5の場合は5）しかないため、ユーザーが見るものを見やすくなります。グリッドサイズと同じです。例えば.col-xs、.col-sm、.col、および.col-lg。
これが意味することは、あなたが4つの異なるサイズのディスプレイでテストするならあなたがユーザーテストをしているとき、あなたはディスプレイにすべての検証を見るということです。
Witdhはビューポートの幅に関連しているため.container-fluidを使用すると表示は動的になります。そのため、変動ははるかに大きくなり、非常に大きな画面または珍しい画面幅を持つユーザーは期待していなかった結果が表示されます。
あなたは3.1 .container-fluidと.containerは同じでコンテナのように動作しますが、それらを削除すると.container-fluid（全幅）のように動作します。彼らは "Mobile First Approach"のための.container-fluidを削除しましたが、現在は3.3.4に戻っています（そしてそれらは異なる動作をします）。
最新のブートストラップを入手するには、stackoverflowに関するこの記事を読んでくださいそれをチェックアウトするのに役立ちます。