如何正確使用引導推送和拉

Question

我一直在嘗試重新排序我的引導列時，在移動視圖中，但我的代碼只是不工作。很可能是因爲我做了不正確的事情。

這裏是我的標記：

<div class="container"> 
    <div class="row text-center"> 
     <div class="col-12"> 
      <h2 class="mb-lg-4 mb-sm-3">Early Stages</h2> 
     </div> 
     <div class="col-md-7 col-sm-push-5"> 
      <p>Also known as &apos;the Poor Fellow-Soldiers of Christ and of the Temple of Solomon&apos;, the Knights Templars were originally founded circa 1120 CE, by Hugues de Payens, as a means to protect Christian pilgrims to the Holy Land. It was originally intended that nine Templars would protect the pilgrims.</p> 
     </div> 
     <div class="col-md-5 col-sm-push-7"> 
      Image Here 
     </div> 
    </div><!--/row--> 
</div> 

我所試圖做的是本質上使「的形象在這裏」一節上面去了「也被稱爲窮人等等。」部分在移動視圖（col-sm）時。我看着Bootstraps指南，但我認爲我不正確地理解它，有人可以告訴我它是如何完成的嗎？

在此先感謝

Answer 1

試試這個HTML

<div class="container"> 

    <div class="row text-center"> 
    <div class="col-12"> 
     <h2 class="mb-lg-4 mb-sm-3">Early Stages</h2> 
    </div> 

    <div class="col-md-5 col-sm-push-7"> 
     Image Here 
    </div> 
    <div class="col-md-7 col-sm-pull-5"> 
     <p>Also known as &apos;the Poor Fellow-Soldiers of Christ and of the Temple of Solomon&apos;, the Knights Templars were originally founded circa 1120 CE, by Hugues de Payens, as a means to protect Christian pilgrims to the Holy Land. It was originally 
     intended that nine Templars would protect the pilgrims.</p> 
    </div> 
    </div> 
    <!--/row--> 

Link for reference

希望這有助於..