在HTML文檔中，列表結構主要有三種，有序列表、無序列表和定義列表。具體使用的標簽說明如下:
無序列表<ul><li>...</li></ul>
有序列表<ol><li>...</li></ol>
定義列表<dl><dt>...</dt><dd>...</dd></dl>
Bootstrap根據平時的使用情形提供了六種形式的列表：
無序列表
無序列表和有序列表使用方式和我們平時使用的一樣(無序列表使用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上面做了一些調整。
去點列表
在Bootstrap中默認情況下無序列表和有序列表是帶有項目符號的，但在實際工作中很多時候，我們的列表是不需要這個編號的，比如說用無序列表做導航的時候。Bootstrap為眾多開發者考慮的非常周道，通過給無序列表添加一個類名".list-unstyled",這樣就可以去除默認的列表樣式的風格。
/*源碼請查看bootstrap.css文件第580行~第583行*/
.list-unstyled{padding-left:0;list-style:none;}
從示例中可以看出，除了項目編號之外，還將列表默認的左邊內距也清0了。
內聯列表
Bootstrap像去點列表一樣，通過添加類名".list-inline"來實現內聯列表，簡單點說就是把垂直列表換成水平列表，而且去掉項目符號(編號),保持水平顯示。也可以說內聯列表就是為制作水平導航而生。
/*源碼查看bootstrap.css文件第584行~第593行*/
.list-inline{padding-left:0;margin-left:-5px;list-style:none;}
.list-inline > li{display:inline-block;padding-right:5px;padding-left:5px;}
定義列表
對于定義列表而言，Bootstrap并沒有做太多的調整，只是調整了行間距，外邊距和字體加粗效果
/*源碼請查看bootstrap.css文件第594行~第607行*/
dl{margin-top:0;margin-bottom:20px;}
dt,dd{line-height:1.42857143;}
dt{font-weight:bold;}
dd{margin-left:0;}
水平定義列表
水平定義列表就像內聯列表一樣，Bootstrap可以給<dl>添加類名".dl-horizontal"給定義列表實現水平顯示效果。
/*源碼請查看bootstrap.css文件第608行~第621行*/
@media(min-width:768px){
.dl-horizontal? dt{float:left;width:160px;overflow:hidden;clear:left;text-align:right;text-overflow:ellipsis;white-space:nowrap;}
.dl-horizontal dd{margin-left:180px;}
}
此處添加了一個媒體查詢。也就是說，只有屏幕大于768px的時候，添加類名".dl-horizontal"才具有水平定義列表效果。其實現主要方式：
①.將dt設置了一個左浮動，并且設置了一個寬度為160px;②.將dd設置了一個margin-left的值為180px,達到水平的效果;③.將標題寬度超過160px時，將會顯示三個省略號。
代碼
在Bootstrap主要提供了三種代碼風格:
1.使用<code></code>來顯示單行內聯代碼
2.使用<pre></pre>來顯示多行塊代碼
3.使用<kbd></kbd>來顯示用戶輸入代碼
預編譯版本的Bootstrap將代碼的樣式單獨提取出來:
1.LESS版本，請查閱code.less文件
2.Sass版本，請查閱_code.scss文件
編譯出來的CSS代碼請查閱bootstrap.css文件第688行~第730行，由于代碼太長，此處不一一例舉。
在使用代碼時，用戶可以根據具體的需求來使用不同的類型：
1.<code>:一般是針對單個單詞或單個句子的代碼
2.<pre>：一般是針對多行代碼(也就是成塊的代碼)
3.<kbd>：一般是表示用戶通過鍵盤輸入的內容
雖然不同的類型風格不一樣，但其使用方法是類似的。
code風格：
<div><code>&It;... ...></code></div>
pre風格:
<div><pre>&It;... ...></pre></div>
kbd風格:
<div>請輸入<kbd>...</kbd></div>
不管使用哪種代碼風格，在代碼中碰到小于號(<)要使用硬編碼"&It;"替代，大于號(>)使用">"來替代。而且對于<pre>代碼塊風格，標簽前面留多少個空格，在顯示效果中就會留多少個空格。建議間編寫HTML標簽時，就控制好。
正如前面所示，<pre>元素一般用于顯示大塊的代碼，并且保證原有格式不變。但有時候代碼太多，而且不想讓其占有太大的頁面篇幅，就想控制代碼塊的大小。Bootstrap也考慮到這一點，你只需要在pre標簽上添加類名".pre-scrollable"，就可以控制代碼塊區域最大高度為340px，一旦超出這個高，就會在Y軸出現滾動條。
/*源碼請查看bootstrap.css第731行~第734行*/
.pre-scrollable{max-height:340px;overflow-y:scroll;}
