0

我在一个布局中使用了四个面板,每个面板都是全宽的。他们应该在 sm 和 xs 视图中很好地堆叠。我已将面板设置为在 md 和 lg 视图尺寸中没有样式,这应该可以正常工作。

仅在 sm 和 xs 视图中时,如何让它们显示折叠?目前,它们是打开的,这没关系,但考虑到某些数据的高度,如果我可以折叠初始状态会更好。

无法将代码放在这里,因为它充满了其他数据库、js 和其他东西的负载,因为我们仍在构建它并且尚未清理到文件中。

4

1 回答 1

6

1) 需要div class="row"

2)col-xs-auto,所有不需要调用其他人col-smmd或者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>
于 2015-05-21T14:40:48.357 回答