bootstrap中contain和contain-fluid的区别

container和container-fluid是bootstrap的外层容器。首先，两者都是支持响应式布局的，也就是会适应不同的设备改变宽度，区别是container是固定宽度，bootstrap为不同设备设定了不同的固定宽度，而container-fluid是100%宽度，宽度会尽可能的宽。

container和container-fluid共有的样式是这个，

.container-fluid ,.container{
    padding-right: 15px;
    padding-left: 15px;
    margin-right: auto;
    margin-left: auto;
}

但container有媒体查询

@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是用百分比宽度，那么就可以当做内嵌了一个随父元素大小而改变的盒子啦。

也不难理解，fluid就是液体的意思，把水倒进盒子里，水当然会充满整个盒子。

本来还想传多两张照片，但不知为什么传不了。

小菜鸟一个，有什么不对的请指出，期望您的指点一二。