整理自笔记
列表组是Bootstrap框架新增的一个组件，可以用来制作列表清单、垂直导航等效果，也可以配合其他的组件制作出更漂亮的组件。基础列表组
基础列表组，看上去就是去掉了列表符号的列表项，并且配上一些特定的样式。在Bootstrap框架中的基础列表组主要包括两个部分： * list-group：列表组容器，常用的是ul元素，当然也可以是ol或者div元素 * list-group-item：列表项，常用的是li元素，当然也可以是div元素 来看一个简单的示例：
rush:xhtml;">
带徽章的列表组
带徽章的列表组其实就是将Bootstrap框架中的徽章组件和基础列表组结合在一起的一个效果。具体做法很简单，只需要在“list-group-item”中添加徽章组件“badge”：
rush:xhtml;">
- 揭开CSS3的面
- CSS3选择器
- CSS3边框
- CSS3背景
- CSS3文本
带链接的列表组
带链接的列表组，其实就是每个列表项都具有链接效果。大家可能最初想到的就是在基础列表组的基础上，给列表项的文本添加链接：
rush:xhtml;">
- ...
这样做有一个不足之处，就是链接的点击区域只在文本上有效,但很多时候，都希望在列表项的任何区域都具备可点击。这个时候就需要在链接标签上增加额外的样式：“display:block”；虽然这样能解决问题，达到需求。但在Bootstrap框架中，还是采用了另一种实现方式。就是将ul.list-group使用div.list-group来替换，而li.list-group-item直接用a.list-group-item来替换。这样就可以达到需要的效果：
rush:xhtml;">
自定义列表组
Bootstrap框加在链接列表组的基础上新增了两个样式： * list-group-item-heading：用来定义列表项头部样式 * list-group-item-text：用来定义列表项主要内容 这两个样式最大的作用就是用来帮助开发者可以自定义列表项里的内容，如下面的示例：
