Bootstrap 3列到2行(Bootstrap 3 columns to 2 rows)

 我有一个3列的行。 在小型设备中，我想将它转换为“第一行”中的两个列，将“第二行”中的1个居中列转换为反向金字塔。 
 
 可能吗？ 
 
 我尝试使用像这样的一些答案，但是当我回到更大的屏幕时，事情会变得混乱。 
 
<div class="row">
<div class="col-sm-6 col-md-4 col-lg-4">
    <figure class="box-1">
        <img class="services-imgs" src="images/page1-img01.jpg" alt="rehab" />
        <figcaption class="figcaption"><a href="serviços.html">Reabilitação Vestibular</a></figcaption>
    </figure>
</div>
<div class="col-sm-6 col-md-4 col-lg-4">
    <figure class="box-1">    
        <img class="services-imgs" src="images/page1-img02.jpg" alt="drenagem" />
        <figcaption class="figcaption"><a href="serviços.html">Fisioterapia Estética</a></figcaption>
    </figure>          
</div>
<div class="col-sm-6 col-md-4 col-lg-4">
    <figure class="box-1">
        <img class="services-imgs" src="images/traumato.jpg" alt="traumato-ortopédica" />
        <figcaption class="figcaption"><a href="serviços.html">Fisioterapia Traumato-Ortopédica</a></figcaption>
    </figure>            
</div>
</div>

I have a row with 3 cols. In small devices I want to turn it into two cols in the "first row" and 1 centered col in the "second row" just like a reverse pyramid.
 
Is it possible?
 
I tried using some answers like this one what has worked but when I go back to larger screens things get messy.
 
<div class="row">
<div class="col-sm-6 col-md-4 col-lg-4">
    <figure class="box-1">
        <img class="services-imgs" src="images/page1-img01.jpg" alt="rehab" />
        <figcaption class="figcaption"><a href="serviços.html">Reabilitação Vestibular</a></figcaption>
    </figure>
</div>
<div class="col-sm-6 col-md-4 col-lg-4">
    <figure class="box-1">    
        <img class="services-imgs" src="images/page1-img02.jpg" alt="drenagem" />
        <figcaption class="figcaption"><a href="serviços.html">Fisioterapia Estética</a></figcaption>
    </figure>          
</div>
<div class="col-sm-6 col-md-4 col-lg-4">
    <figure class="box-1">
        <img class="services-imgs" src="images/traumato.jpg" alt="traumato-ortopédica" />
        <figcaption class="figcaption"><a href="serviços.html">Fisioterapia Traumato-Ortopédica</a></figcaption>
    </figure>            
</div>
</div>

原文：https://stackoverflow.com/questions/41471857