使用 bootstrap 4 排列 DIV 而不使用额外的 DIV

Question

安排 DIV 使用 bootstarp 网格系统很容易，但有时对我来说无法实现，

我认为它不是很复杂，无需使用额外的 DIV 或代码即可实现，但我的垃圾大脑无法实现此网格设计，

谢谢

Answer 1

This site 可以帮助您创造您想要的东西。

Answer 2

试试这个布局：-

<div class="row">
  <div class="col-lg-2 col-3"></div>
  <div class="col-lg-8 col-6">
    <div class="row">
      <div class="col-lg-3 col-12"></div>
      <div class="col-lg-3 col-12"></div>
      <div class="col-lg-6 col-12">
        <div class="row">
          <div class="col-lg-6 col-6"></div>
          <div class="col-lg-6 col-6"></div>
        </div>
      </div>
    </div>
  </div>
  <div class="col-lg-2 col-3"></div>
</div>

使用 bootstrap 4 排列 DIV 而不使用额外的 DIV

Arranging DIV using bootstrap 4 without using extra DIV

html

css

bootstrap-4

bootstrap-grid