bootstrap崩溃的bootstrap分页

时间:2014-03-08 02:57:54

标签: asp.net twitter-bootstrap twitter-bootstrap-3

我已经构建了一个具有许多引导折叠面板的屏幕,我想使用分页来使屏幕更容易使用。这可能吗?我一直在寻找这个代码示例,但我只找到了分页的例子,而不是崩溃的分页。首先,这是可能的,如果是这样,我知道或有一些我可以看到的示例代码。代码

 <div class="panel-group" id="accordion">
        <div class="panel panel-default">
            <div class="panel-heading">
                <h4 class="panel-title">
                    <a data-toggle="collapse" data-parent="#accordion" href="#collapseThree">
                        <div class="container">
                            <div class="row">
                                <div class="col-sm-3">Column 1 </div>
                                <div class="col-sm-3">Column 2s  </div>
                                <div class="col-sm-3">Column 3 </div>
                                <div class="col-sm-3">Column 4 <span class="label-info pull-right">View <i class="fa fa-angle-double-down"></i></span></div>
                            </div>
                        </div>
                    </a>
                </h4>
            </div>
            <div id="collapseThree" class="panel-collapse collapse">
                <div class="panel-body">
                    Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod. Brunch 3 wolf moon tempor, sunt aliqua put a bird on it squid single-origin coffee nulla assumenda shoreditch et. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea proident. Ad vegan excepteur butcher vice lomo. Leggings occaecat craft beer farm-to-table, raw denim aesthetic synth nesciunt you probably haven't heard of them accusamus labore sustainable VHS.
                </div>
            </div>
        </div>
        <div class="panel panel-default">
            <div class="panel-heading">
                <h4 class="panel-title">
                    <a data-toggle="collapse" data-parent="#accordion" href="#Div1">
                        <div class="container">
                            <div class="row">
                                <div class="col-sm-3">Column 1 </div>
                                <div class="col-sm-3">Column 2s  </div>
                                <div class="col-sm-3">Column 3 </div>
                                <div class="col-sm-3">Column 4 <span class="label-info pull-right">View <i class="fa fa-angle-double-down"></i></span></div>
                            </div>
                        </div>
                    </a>
                </h4>
            </div>
            <div id="Div1" class="panel-collapse collapse">
                <div class="panel-body">
                    Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod. Brunch 3 wolf moon tempor, sunt aliqua put a bird on it squid single-origin coffee nulla assumenda shoreditch et. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea proident. Ad vegan excepteur butcher vice lomo. Leggings occaecat craft beer farm-to-table, raw denim aesthetic synth nesciunt you probably haven't heard of them accusamus labore sustainable VHS.
                </div>
            </div>
        </div>
    </div>

1 个答案:

答案 0 :(得分:0)

以下示例(使用您的面板组)使用带有Bootstrap分页组件的简单分页插件。

http://www.bootply.com/120489