繁体   English   中英

如何在 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>

我得到的结果是这个布局

它们应该是一个完整的元素。 我觉得我很亲近。 也许我搞砸了行? 提前致谢!

这是我的解决方案希望它有所帮助。

 <head> <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.3.1/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>

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM