這兩個(gè).container和.container-fluid響應(yīng)（即他們改變基于屏幕寬度的布局），但以不同的方式（我知道，命名不讓它聽起來(lái)這種方式）。
簡(jiǎn)答：
.container 是一個(gè)跳躍/波濤洶涌的大小調(diào)整，和
.container-fluid 連續(xù)/精細(xì)調(diào)整寬度：100％。
從功能角度來(lái)看：
.container-fluid當(dāng)你改變窗口/瀏覽器的寬度時(shí)，不斷調(diào)整大小，不會(huì)留下額外的空白空間，不像.container那樣。（因此命名：“流動(dòng)”而不是“數(shù)字”，“離散”，“分塊”或“量化”）。
.container以幾個(gè)特定寬度調(diào)整大小。換句話說(shuō)，它將是不同的特定的“固定”寬度，不同的屏幕寬度范圍。
語(yǔ)義：“固定寬度”
您可以看到命名混淆是如何產(chǎn)生的。從技術(shù)上講，我們可以說(shuō).container是“固定寬度”，但它只是在沒有在每個(gè)粒度寬度調(diào)整大小的意義上是固定的。它實(shí)際上并不是“固定的”，因?yàn)樗偸潜３衷谔囟ǖ南袼貙挾?，因?yàn)樗鼘?shí)際上可以改變大小。
從基本面來(lái)看：
.container-fluid具有CSS屬性width: 100%;，因此它會(huì)不斷調(diào)整每個(gè)屏幕寬度的粒度。
.container-fluid {
width: 100%;}.container有類似“width = 800px”（或em，rem等）的東西，不同屏幕寬度的特定像素寬度值。當(dāng)然，當(dāng)屏幕寬度超過屏幕寬度閾值時(shí)，這會(huì)導(dǎo)致元素寬度突然跳轉(zhuǎn)到不同的寬度。該閾值由CSS3媒體查詢控制，允許您針對(duì)不同條件應(yīng)用不同的樣式，例如屏幕寬度范圍。
@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元素）使任何固定寬度元素響應(yīng)，因?yàn)槊襟w查詢正是.container后臺(tái)引導(dǎo)程序?qū)崿F(xiàn)的方式（請(qǐng)參閱JKillian對(duì)代碼的回答）。
