Bootstrap旋转木马显示1列在断点

所以我有一个旋转木马显示4个网格，我想它显示移动设备上只有1个网格（col-sm-12），任何人都知道我可以如何实现这一点与jQuery或css？Bootstrap旋转木马显示1列在断点

目前，它的上市4个格就在COL-SM-12，我想让它显示在COL-SM-12 1个格：

<div class="carousel slide" id="myCarousel"> 
    <div class="carousel-inner"> 
     <div class="item active"> 
      <ul class="thumbnails"> 
       <li class="col-md-3 col-sm-12"> 
        <div class="thumbnail"> 
         <img src="http://placehold.it/260x180" alt=""> 
        </div> 
        <div class="caption"> 
         <h5>Arrival Dec, 2013</h5> 
        </div> 
       </li> 
       <li class="col-md-3 col-sm-12"> 
        <div class="thumbnail"> 
         <img src="http://placehold.it/260x180" alt=""> 
        </div> 
        <div class="caption"> 
         <h5>Arrival, November, 2013</h5> 
        </div> 
       </li> 
       <li class="col-md-3 col-sm-12"> 
        <div class="thumbnail"> 
         <img src="http://placehold.it/260x180" alt=""> 
        </div> 
        <div class="caption"> 
         <h5>Arrival Feb, 2014, ON</h5> 
        </div> 
       </li> 
       <li class="col-md-3 col-sm-12"> 
        <div class="thumbnail"> 
         <img src="http://placehold.it/260x180" alt=""> 
        </div> 
        <div class="caption"> 
         <h5>Arrival March 2014, ON</h5> 
        </div> 
       </li> 
      </ul> 
     </div> 
    </div>

来源

2016-06-10 Paul Gwamanda