用一张思维导图简单介绍一下Bootstrap列表吧
Bootstrap六种列表样式.png
1. 无序列表###
<h3>无序列表</h3>
<ul>
<li>语文</li>
<li>数学</li>
<li>英语</li>
</ul>
无序.png
2. 有序列表###
<h3>有序列表</h3>
<ol>
<li>语文</li>
<li>数学</li>
<li>英语</li>
</ol>
有序.png
会发现有序和无序列表的使用方式和我们平时使用的一样（无序列表使用ul，有序列表使用ol标签），在样式方面，Bootstrap只是在此基础上做了一些细微的优化，源码请查看bootstrap.css文件的第569行~第579行：ul,ol { margin-top: 0; margin-bottom: 10px;}ul ul,ol ul,ul ol,ol ol { margin-bottom: 0;}从源码上我们可以得知，Bootstrap对于列表，只是在margin上做了一些调整。
3. 去点列表###
<h3>去点列表</h3>
<ol class="list-unstyled">
<li>语文</li>
<li>数学</li>
<li>英语</li>
</ol>
去点.png
添加 .list-unstyled 属性 ，有序列表则去掉了序号变成去点列表
4.内联列表###
<h3>内联列表</h3>
<ul class="list-inline">
<li><a>语文</a></li>
<li><a>数学</a></li>
<li><a>英语</a></li>
</ul>
内联.png
添加 .list-inline属性 变为内联列表，简单点说就是把垂直方向的列表变为水平方向。内联列表一般用作菜单（导航）样式
5.dl列表###
<h3>dl列表</h3>
<dl>
<dt>娃哈哈</dt>
<dd>娃哈哈是个老品牌，深受大家的喜爱</dd>
<dt>爽歪歪</dt>
<dd>爽歪歪是个老品牌，深受大家的喜爱</dd>
</dl>
dl.png
<dl>标记定义了一个定义列表，定义列表中的条目是通过使用<dt>标记(“definition title”: 定义标题)和<dd>标(“definition description”: 定义描述)创建的。<dt>给出了术语名，<dd>标记给出了术语的定义。
6.水平列表###
<h3>水平列表</h3>
<dl class="dl-horizontal">
<dt>娃哈哈</dt>
<dd>娃哈哈是个老品牌，深受大家的喜爱</dd>
<dt>爽歪歪</dt>
<dd>爽歪歪是个老品牌，深受大家的喜爱</dd>
<dt>营养快线</dt>
<dd>营养快线是个老品牌，深受大家的喜爱</dd>
</dl>
水平.png
添加.dl-horizontal属性变成水平列表。观察上面的水平列表，是由标题+内容组成，即前面
<dt>给定标题，后面<dd>给一段描述。
好了，以上就是Bootstrap列表的六种样式。
每天都努力一点
谢谢你看完
