container和container-fluid的区别

Posted 2023-03-26

container-fluid的width是100％，而container的width是用媒体查询获得的动态尺寸。两者样式肯定是不一样的。并且由于padding的原因两者不可用嵌套，他们就是提供两种视觉风格。 参考技术A container：固定960px宽度； （如果又引入了响应式样式，则会适当调整；例如1600×900，它会使用1200px ； 参见css文档：
/* 大屏幕 */
@media (min-width: 1200px) ...
/* 平板电脑和小屏电脑之间的分辨率 */
@media (min-width: 768px) and (max-width: 979px) ...
/* 横向放置的手机和竖向放置的平板之间的分辨率 */
@media (max-width: 767px) ...
/* 横向放置的手机及分辨率更小的设备 */
@media (max-width: 480px) ... ) ）
container-fluid：自适应屏幕宽度，即满屏显示； 参考技术B container-fluid和container 全部都是响应式的布局
只是container有1个98px的margin 存在 Container-fluid 没有