提问人:will 提问时间:11/17/2022 最后编辑:will 更新时间:11/17/2022 访问量:26
如何在 Bootstrap 中嵌套网格
How to nest grids in Bootstrap
问:
我是 Bootstrap 的初学者,我正在尝试使用这种布局在 Bootstrap 中创建网格
我写了这个:
<div class=’container-fluid’></div>
<div class="row">
<div class="col-sm-3 bg-primary"><img src="images/about.jpg" class= "imageAboutPage" alt=""></div>
<div class='col'>
<div class=’row’>
<div class="col bg-primary">Lorem ipsum dolor.</div>
<div class="col bg-secondary">Lorem ipsum dolor.</div>
</div>
</div>
我得到的结果是这个布局
它们应该是一个完整的元素。我觉得我离得很近。也许我搞砸了行?提前致谢!
答:
0赞
rizaldodo
11/17/2022
#1
这是我的解决方案,希望它有所帮助。
<head>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
</head>
<div class="row">
<div class="col-sm-3 bg-primary" style="height:200px"><img src="images/about.jpg" class= "imageAboutPage" alt=""></div>
<div class="col">
<div class="row bg-primary h-50">Lorem ipsum dolor.</div>
<div class="row bg-secondary h-50">Lorem ipsum dolor.</div>
</div>
</div>
评论
0赞
will
11/17/2022
我必须添加 to to 才能让它在我这边正确格式化并做出响应,但总的来说这很棒。谢谢一堆!h-75
<div class="col-sm-3 bg-primary h-75" style="height:200px">
评论
<!DOCTYPE html> <html lang="en">