Bootstrap的HTML问题

Question

我正在尝试在bootstrap中创建以下内容

这是我目前的标记

   <section id="about" class="module" style="background-color:#5690AF">
    <div class="container-fluid">
        <div class="row">
            <div class="col-lg-6 text-center">
                <img src="~/Content/Images/hackit.png" class="img-responsive" />
            </div>
            <div class="col-lg-6">
                <div class="row">
                    <div class="col-lg-3" style="background-color:#E8E8E8">
                        <img src="~/Content/Images/faceCup.png" class="img-responsive" />
                    </div>
                    <div class="col-lg-3" style="background-color:#EA6000">
                        <img src="~/Content/Images/bernardApron.png" class="img-responsive" />
                    </div>
                </div>
                <div class="row" style="background-color: #6A9574">
                    <img src="~/Content/Images/gardenHeart.png" class="img-responsive" />
                </div>
            </div>
        </div>
    </div>
</section>

然而，当我运行项目时，我得到了

在查看我的HTML后，我认为我所拥有的是正确的，但遗憾的是它与我的预期完全不同，是否有人能够帮助我。

由于

Answer 1

试试这个，

<section id="about" class="module" style="background-color:#5690AF">
    <div class="container-fluid">
        <div class="row">
            <div class="col-lg-6 text-center">
                <img src="~/Content/Images/hackit.png" class="img-responsive" />
            </div>
            <div class="col-lg-6">
                <div class="row">
                    <div class="col-lg-6 text-center" style="background-color:#E8E8E8">
                        <img src="~/Content/Images/faceCup.png" class="img-responsive" />
                    </div>
                    <div class="col-lg-6 text-center" style="background-color:#EA6000">
                        <img src="~/Content/Images/bernardApron.png" class="img-responsive" />
                    </div>
                </div>
                <div class="row" style="background-color: #6A9574">
                    <div class="col-lg-12 text-center">
                        <img src="~/Content/Images/gardenHeart.png" class="img-responsive" />
                    </div>
                </div>
            </div>
        </div>
    </div>
</section>