在bootstrap中的布局容器一栏中,提供了container与container-fluid两种容器,其官方解释为:
.container 类用于固定宽度并支持响应式布局的容器。
.container-fluid 类用于 100% 宽度,占据全部视口(viewport)的容器。
所以,先说一说它们的共同点:这两种容器的高度设定都是一致的,都为auto。而他们的不同就在于它们宽度的设定上。
container根据屏幕宽度利用媒体查询,已经设定了固定的宽度,作用为阶段性的改变宽度,所以在改变浏览器的大小时,页面是一个阶段一个阶段变化的。
container-fluid则是将宽度设定为auto,所以当缩放浏览器时,它会保持全屏大小,始终保持100%的宽度。