html - 如何将 Bootstrap 设置为垂直

Question

我有问题，我需要在黄色框下方的左侧多一个框

我使用这段代码进行 Bootstrap

<div class="col-md-3" style="background-color:yellow">
   a<br>b<br>c<br>d
   </div>

有谁知道如何再制作一个垂直的盒子？我对此一无所知:(

Answer 1

如果您使用的是 bootstrap 4。

你可以在元素周围添加一个包装器，使包装器成为一个 flex 容器并使用 flex-column 垂直 flex

使用 Bootstrap 类

<div class="col-md-3 d-flex flex-column">
  <div style="background-color:yellow">
    a<br>b<br>c<br>d
  </div>
  <div style="border: 1px solid blue">
    1<br>2
  </div>
</div>

https://codepen.io/jacobgoh101/pen/YEwjLp