用一張思維導圖簡單介紹一下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列表的六種樣式。
每天都努力一點
謝謝你看完
