我使用此示例：http://sevenx.de/demo/bootstrap-carousel/inc.carousel/product-slider.html 当我使BrowserWindow变小时，框首先开始变小，但是当我达到约990px的最小宽度时，单个产品在我的起始宽度的4个块中排列。 是否有可能只在最大宽度上显示一个产品：990px？ 因为它不像现在这样好看。对不起，我是一个全新的人，我不明白如何根据我的想法设置旋转木马。 感谢您的帮助！
更新：这是我的小提琴：
`http://jsfiddle.net/bGwXd/`
当你在我的小提琴中使结果块更大时，你会看到一个水平线上的起始视图，4个产品。当你做得更小时，垂直线上有4种产品。而现在我只想在我的垂直线上只有一个产品左侧导航。
答案 0 :(得分：1)
在div .item你有.row你有4个.col-md-3 div你删除其他3并且只留一个并给它一个类.col-md-12。试试吧 这是你想要的吗？ http://jsfiddle.net/bGwXd/1/
<div id="myCarousel" class="carousel slide">
<div class="carousel-inner">
<div class="item active">
<div class="row">
<div class="col-md-12">
<div class="thumbnail">
<img src="http://placehold.it/300x200/" alt="Slide12">
<div class="caption">
<h3>Product label</h3>
<p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor</p>
<p><a href="#" class="btn btn-primary" role="button">12,99 €</a> <a href="#" class="btn btn-default" role="button">Wishlist</a></p>
</div>
</div>
</div>
</div>
</div>
<div class="item">
<div class="row">
<div class="col-md-3">
<div class="thumbnail">
<img src="http://placehold.it/300x200/" alt="Slide21">
<div class="caption">
<h3>Product label</h3>
<p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor</p>
<p><a href="#" class="btn btn-primary" role="button">12,99 €</a> <a href="#" class="btn btn-default" role="button">Wishlist</a></p>
</div>
</div>
</div>
<div class="col-md-3">
<div class="thumbnail">
<img src="http://placehold.it/300x200/" alt="Slide22">
<div class="caption">
<h3>Product label</h3>
<p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor</p>
<p><a href="#" class="btn btn-primary" role="button">12,99 €</a> <a href="#" class="btn btn-default" role="button">Wishlist</a></p>
</div>
</div>
</div>
<div class="col-md-3">
<div class="thumbnail">
<img src="http://placehold.it/300x200/" alt="Slide23">
<div class="caption">
<h3>Product label</h3>
<p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor</p>
<p><a href="#" class="btn btn-primary" role="button">12,99 €</a> <a href="#" class="btn btn-default" role="button">Wishlist</a></p>
</div>
</div>
</div>
<div class="col-md-3">
<div class="thumbnail">
<img src="http://placehold.it/300x200/" alt="Slide24">
<div class="caption">
<h3>Product label</h3>
<p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor</p>
<p><a href="#" class="btn btn-primary" role="button">12,99 €</a> <a href="#" class="btn btn-default" role="button">Wishlist</a></p>
</div>
</div>
</div>
</div>
</div>
<div class="item">
<div class="row">
<div class="col-md-3">
<div class="thumbnail">
<img src="http://placehold.it/300x200/" alt="Slide31">
<div class="caption">
<h3>Product label</h3>
<p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor</p>
<p><a href="#" class="btn btn-primary" role="button">12,99 €</a> <a href="#" class="btn btn-default" role="button">Wishlist</a></p>
</div>
</div>
</div>
<div class="col-md-3">
<div class="thumbnail">
<img src="http://placehold.it/300x200/" alt="Slide32">
<div class="caption">
<h3>Product label</h3>
<p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor</p>
<p><a href="#" class="btn btn-primary" role="button">12,99 €</a> <a href="#" class="btn btn-default" role="button">Wishlist</a></p>
</div>
</div>
</div>
<div class="col-md-3">
<div class="thumbnail">
<img src="http://placehold.it/300x200/" alt="Slide33">
<div class="caption">
<h3>Product label</h3>
<p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor</p>
<p><a href="#" class="btn btn-primary" role="button">12,99 €</a> <a href="#" class="btn btn-default" role="button">Wishlist</a></p>
</div>
</div>
</div>
<div class="col-md-3">
<div class="thumbnail">
<img src="http://placehold.it/300x200/" alt="Slide34">
<div class="caption">
<h3>Product label</h3>
<p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor</p>
<p><a href="#" class="btn btn-primary" role="button">12,99 €</a> <a href="#" class="btn btn-default" role="button">Wishlist</a></p>
</div>
</div>
</div>
</div>
</div>
</div>
<a class="left carousel-control" href="#myCarousel" data-slide="prev"><i class="fa fa-chevron-left fa-2x"></i></a>
<a class="right carousel-control" href="#myCarousel" data-slide="next"><i class="fa fa-chevron-right fa-2x"></i></a>
<ol class="carousel-indicators">
<li data-target="#myCarousel" data-slide-to="0" class="active"></li>
<li data-target="#myCarousel" data-slide-to="1"></li>
<li data-target="#myCarousel" data-slide-to="2"></li>
</ol>
</div><!-- End Carousel -->
答案 1 :(得分：1)
轮播通过显示行中的所有项目来工作。目前，每行有4个项目，这些项目都会显示出来。
＆gt; 990px处的视图响应于将它们连续4行显示，＆lt; 990px处的视图垂直显示它们。
轮播中没有方法允许在不重构html的情况下查看其上的单个元素。您需要添加一些javascript，根据大小，使用轮播回调函数将相关项移动到自己的行。
答案 2 :(得分：1)
我知道它已经很晚了但是有人来这里寻求帮助应该尝试this一个：