Bootstrap3中.container和.container-fluid区别


.container与.container_fluid是bootstrap中的两种不同类型的外层容器,按照官方的说法,这两者的区别是:

.container 类用于固定宽度并支持响应式布局的容器。
.container-fluid 类用于 100% 宽度,占据全部视口(viewport)的容器,自动实现响应式。
/*0-768px以上宽度container为100%*/
.container {
  padding-right: 15px;
  padding-left: 15px;
  margin-right: auto;
  margin-left: auto;
}
/*768-992px以上宽度container为750px*/
@media (min-width: 768px) {
  .container {
    width: 750px;
  }
}
/*992-1200px以上宽度container为970px*/
@media (min-width: 992px) {
  .container {
    width: 970px;
  }
}
/*1200px以上宽度container为1170px*/
@media (min-width: 1200px) {
  .container {
    width: 1170px;
  }
}

/*container-fluid为100%*/
.container-fluid {
  padding-right: 15px;
  padding-left: 15px;
  margin-right: auto;
  margin-left: auto;
}

 




					


免责声明!

本站转载的文章为个人学习借鉴使用,本站对版权不负任何法律责任。如果侵犯了您的隐私权益,请联系本站邮箱yoyou2525@163.com删除。



 
粤ICP备18138465号  © 2018-2025 CODEPRJ.COM