在bootstrap3轮播中的移动视图中显示一列

Question

我使用bootstrap3 carousel为产品展示创建了一个轮播。我的项目中有4列。我在移动视图中显示这些项目时遇到问题。因为我在轮播项目引导程序中使用了列在移动视图中垂直对齐列，但我需要在移动视图中一次只显示一个产品。这是相同的代码。

Answer 1

您可以明确隐藏或显示不同宽度的元素（http://getbootstrap.com/css/#responsive-utilities-classes）。例如。将class="hidden-xs"添加到最后三个元素，因此只有第一个元素在超小（＆lt; 768px）设备上可见。

修改

哦，我没注意到。所以也许你可以在html中使用多个视图，只显示所需的视图。

<div id="defaultview" class="hidden-xs">
    <!-- default carousel / more items per slide -->
</div>
<div id="smallview" class="visible-xs">
    <!-- carousel with one item per slide -->
</div>