关于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;
  }
}

对于其中的width: 1170px;不理解,在学习CSS时如果是

#divdemo {
                width: 1170px;
            }

这个应该是设置的内容的宽度,而div的实际宽度还要加上padding,但是bootstrap中设置的width按照效果来看,直接将div的宽度设置上了1170px,和CSS有悖,不知道这一块如何解释?

阅读 2.5k
1 个回答

你应该是没有注意到全局设置的

* {
box-sizing: border-box;
}
撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题
宣传栏