bootstrap中的.container类定义

bootstrap中的.container类定义

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

 @media (min-width:768px){
     .container{
         width:750px
     }

 }

 @media (min-width:992px){
     .container{
         width:970px
     }

 }

 @media (min-width:1200px){
     .container{
         width:1170px
     }

 }

所谓固定宽度并不是允许开发者自己设置容器的宽度，而是bootstrap内部根据屏幕宽度利用媒体查询，帮我们设置了固定宽度，并且是能够自适应的。

所以，无论何种情况下，请不要手动为响应式布局中的外层布局容器设置固定宽度值。

那么，.container-fluid，又是怎样的呢？

根据测试，.container-fluid自动设置为外层视窗的100%，如果外层视窗为body，那么它将全屏显示，无论屏幕大小，并且自动实现响应式布局。