使用 Collapse 组件，我们可以去创建一个 accordion，就是用手风琴的形式来展示内容 ..

先添加一个大包装 .. 上面加上个 id ，名字可以是 accordion .. 一会儿我们会用这个 id 的值 ..

里面可以使用两卡组件 .. 一个 .card 下面有个 card-header ，同级别还有个 card-body ..

卡片的 header 里面可以放一个链接 .. 文字是 title .. 使用卡片的 header 可以切换显示卡片的 body 里的内容 .. 再给这个 body 添加一个包装 ... 上面加上 collapse ，这样默认会把 body 里的内容隐藏起来 .

这个包装上面可以再添加一个 id，collapse-1 ， header 里的这个链接的地址就是刚才我们添加的这个 id 的值 .. #collapse-1 .. 再添加一个 data-toggle ，对应的值是 collapse ，这样会触发这个元素的行为，让它可以切换显示内容 ..

复制一份这个卡片 .. 修改一下里面的内容 .. 这个 id 可以换成 collapse-2 ... 标题链接的地址也要变成 collapse-2

现在点击卡片的标题 .. 可以显示这个卡片的主体内容 .. 现在可以同时显示所有卡片里的内容 .. 再去改造一下 .. 在这个 collapse 包装上，再添加一个 data-parent .. 对应的值就是所有卡片的整体的包装元素 .. 就是 id 是 accordion 的这个元素 ..

再把这个属性添加到另外一个卡片里面 ..

一个手风琴里面可以设置一个初始要显示的内容 .. 在这个 collapse 包装上，再添加一个 show

然后再去试一下 ..

点一下卡片的标题 .. 可以显示它里面的内容 .. 同时会隐藏其它卡片的主体内容 ..