我在布局中使用了四个面板,每个面板都是全宽。它们可以很好地堆叠在 sm 和 xs View 中。我已经将面板设置为在 md 和 lg View 大小时没有样式,这可以正常工作。
当仅在 sm 和 xs View 中时,如何让它们折叠显示?目前,它们是打开的,但考虑到一些数据的高度,如果我可以折叠初始状态会更好。
不能将代码放在这里,因为它充满了其他数据库、js 和其他东西的负载,因为我们仍在构建它并且尚未清理到文件中。
最佳答案
1) 需要div class="row"
2) col-xs-
是auto,因为不需要调用其他的col-sm
, md
或 lg
无论如何都会像 col-xs、col-sm、col-md 和 col-lg 一样工作
看这里Grid-options
<div class="row">
<div class="col-xs-3">
<div class="panel panel-default">
<div class="panel-body">
Basic panel example
</div>
</div>
</div>
<div class="col-xs-3">
<div class="panel panel-default">
<div class="panel-body">
Basic panel example
</div>
</div>
</div>
<div class="col-xs-3">
<div class="panel panel-default">
<div class="panel-body">
Basic panel example
</div>
</div>
</div>
<div class="col-xs-3">
<div class="panel panel-default">
<div class="panel-body">
Basic panel example
</div>
</div>
</div>
</div>
现在如果你只想显示 col-lg 和 col-md
你需要这个:
<div class="row">
<div class="col-md-6 col-lg-6 visible-md visible-lg hidden-xs hidden-md">
</div>
</div>
关于css - 响应 View 中的 Bootstrap 3 面板,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/30375558/