HTML問題與引導

Question

我想創建引導內以下

這是我當前的標記

<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> 

然而，當我運行該項目，我得到

後l在我的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>