嗨,我正在做一些工作在bootstrap,我试图有一个列在左边,这将提供一些信息和另一个集合的列在右边,将包含图像。
到目前为止,我已经尝试了以下代码。
<div class="container-fluid">
<div class="row">
<div class="col-md-4"></div>
<div class="col-md-2">
hello
</div>
<div class="col-md-2">
hello
</div>
<div class="col-md-2">
hello
</div>
<div class="col-md-2">
hello
</div>
<div class="col-md-2">
hello
</div>
</div>
</div>
但是当我添加第五个 col-md-2
它把它推到下面 col-md-4
而我想让它留在第一页的下面。col-md-2
.
请看下面我想要什么
我怎样才能做到这一点?
为了实现你的目标,你必须需要改变你的代码,像下面。
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css">
<div class="container-fluid">
<div class="row">
<div class="col-md-4"></div>
<div class="col-md-8">
<div class="row">
<div class="col-md-2">
hello
</div>
<div class="col-md-2">
hello
</div>
<div class="col-md-2">
hello
</div>
<div class="col-md-2">
hello
</div>
<div class="col-md-2">
hello
</div>
<div class="col-md-2">
hello
</div>
<div class="col-md-2">
hello
</div>
<div class="col-md-2">
hello
</div>
</div>
</div>
</div>
</div>