bootstrap4.0中container容器

最新推荐文章于 2024-06-02 17:21:14 发布

行之所致

最新推荐文章于 2024-06-02 17:21:14 发布

阅读量734

点赞数

分类专栏： CSS

本文链接：https://blog.csdn.net/weixin_44811301/article/details/109555836

版权

CSS 专栏收录该内容

12 篇文章 0 订阅

订阅专栏

在这里插入图片描述

.container,
.container-fluid,
.container-sm,
.container-md,
.container-lg,
.container-xl {
  /* 初始样式 */
  width: 100%;
  padding-right: 15px;
  padding-left: 15px;
  margin-right: auto;
  margin-left: auto;
}

/* 屏幕大于576px,container的最大宽度为540px; */
@media (min-width: 576px) {
  .container, .container-sm {
    max-width: 540px;
  }
}

@media (min-width: 768px) {
  .container, .container-sm, .container-md {
    max-width: 720px;
  }
}

@media (min-width: 992px) {
  .container, .container-sm, .container-md, .container-lg {
    max-width: 960px;
  }
}

@media (min-width: 1200px) {
  .container, .container-sm, .container-md, .container-lg, .container-xl {
    max-width: 1140px;
  }
}