Question

在bootstrap导航中，我们可以以折叠格式显示菜单。我想以collasing格式显示div。例如，如果它是移动视图，那么只显示顶部div并在折叠模式下隐藏所有div。我知道bootstrap响应中的以下支持

.visible-phone  
.visible-tablet 
.visible-desktop
.hidden-phone
.hidden-tablet
.hidden-desktop

如果不支持，请大家分享如何实施。

Answer 1

nirajkumar ，请看一下 Fiddle 。
你可以使用.hidden-xs Bootstrap类在这里做你想做的事使用版本3.3.4。

<div class="col-xs-12 col-sm-6 col-sm-offset-3 col-md-4 col-md-offset-1 col-lg-3 col-lg-offset-1 text-center block2 hidden-xs">
     Div #1
</div>
<div class="col-xs-12 col-sm-12 col-md-4 col-md-offset-2 col-lg-3 col-lg-offset-4 text-center block2">
     Div #2
</div>

Answer 2

这是在正式的Bootstrap文档中列出的。这是链接： http://getbootstrap.com/css/#responsive-utilities-classes

Answer 3

我假设您可以使用Javascript。您可以使用JavaScript创建折叠效果（已在Bootstrap中实现：http://getbootstrap.com/javascript/查找“折叠”）。实际上，您根本不需要编写任何Javascript代码。

Bootstrap响应：在折叠模式下显示多个div

3 个答案: