主页 / 问题 / 1093169
Accepted
EgorG
Asked:2020-03-11 04:22:16 +0000 UTC2020-03-11 04:22:16 +0000 UTC

更改屏幕宽度时换行。引导程序

  • 772

大家好。有这部分布局

<div class="row exp">
        <div class="col col-ex d-flex flex-column">

        </div>
        <div class="col col-cat">

        </div>
    </div>

在大屏幕上，它看起来像水平并排的两列。我试图做到这一点，以便在使用中等屏幕时，第一列占据父级的整个宽度，第二列移动到第一列下方并且也占据整个宽度。请告诉我我该怎么做？

css

1 个回答

  1. Best Answer

    代替 col 类，添加 col-md-6 或 col-lg-6 类（取决于您希望更改的屏幕尺寸）：

    [class^="col"] {
  border: 1px solid red;
  padding: 50px;
}
    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css" integrity="sha384-Vkoo8x4CGsO3+Hhxv8T/Q5PaXtkKtu6ug5TOeNV6gBiFeWPGFN9MuhOf23Q9Ifjh" crossorigin="anonymous">
<div class="row exp">
  <div class="col-md-6 col-ex d-flex flex-column">

  </div>
  <div class="col-md-6 col-cat">

  </div>
</div>

    • 1

相关问题