Bootstrap3 折叠插件的使用方法

折叠

折叠插件（collapse.js）可以很容易地让页面区域折叠起来。当列表菜单的条目特别多，而页面空间有限时，使用类似于手风琴的折叠菜单可以节约页面空间，方便用户浏览。

使用方法

Bootstrap中，折叠组件的基本结构是在一个 class="accordion" 的容器中，包含一个或多个 class="accordion-group" 的折叠面板子容器。如：

2.   

  ...

  

每个折叠面板包含两部分内容：一个是标题部分，一个是内容部分。

标题部分使用 class="accordion-heading" 的元素定义，用于定义导航的标题。标题中一般会包含一个链接，必须为链接添加 data-toggle="collapse" 和 data-target 属性，data-target 属性接受一个 CSS 选择器，并会对其应用折叠效果。

内容部分使用 class="accordion-body collapse" 的元素定义，如果希望某个内容部分默认被展开，可以给它添加一个 .in 类。如：

2.   
3.     
4.       
5.         Collapsible Group Item #1
6.       
7.     

    

      

        Anim pariatur ...