Bootstrap网格自定义布局

Question

我一直在学习这种设计

<section>
    <div class="container">

    <div class="row">

        <div class="row">
            <div class="col-lg-12 col-md-12">
                <img src="image.png" alt="" class="img-fluid">
            </div>        
        </div>

        <div class="row">
            <div class="col-lg-6 col-md-6">
                <img src="image.png" alt="" class="img-fluid">
            </div>
        </div>

        <div class="row">
            <div class="col-lg-6 col-md-6">
                <img src="image.png" alt="" class="img-fluid">
            </div>
            <div class="col-lg-6 col-md-6">
                <img src="image.png" alt="" class="img-fluid">
            </div>
        </div>

    </div>

    </div>
</section>

我正在获得以下设计

请您帮我设计一下，让我知道我要去哪里了吗？

谢谢

Answer 1

<section>
   <div class="container">
       <div class="row">               
           <div class="col-lg-12 col-md-12">
               <img src="image.png" alt="" class="img-fluid">       
           </div>
       </div>
       <div class="row">
            <div class="col-lg-6 col-md-6">
                <img src="image.png" alt="" class="img-fluid">
            </div>
            <div class="col-lg-6 col-md-6">
                <div class="row">
                    <div class="col-lg-12 col-md-12">
                        <img src="image.png" alt="" class="img-fluid">
                    </div>
                    <div class="col-lg-12 col-md-12">
                        <img src="image.png" alt="" class="img-fluid">
                    </div>
                </div>
            </div>
        </div>
    </div>
</section>