列表

Bootstrap 支持有序列表、无序列表和定义列表。

 

有序列表：有序列表是指以数字或其他有序字符开头的列表。

无序列表：无序列表是指没有特定顺序的列表，是以传统风格的着重号开头的列表。如果您不想显示这些着重号，您可以使用 class .list-unstyled 来移除样式。您也可以通过使用 class .list-inline 把所有的列表项放在同一行中。

定义列表：在这种类型的列表中，每个列表项可以包含 <dt> 和 <dd> 元素。<dt> 代表 定义术语，就像字典。接着，<dd> 是 <dt> 的描述。.dl-horizontal 可以让 <dl> 内的短语及其描述排在一行。开始是像 <dl> 的默认样式堆叠在一起，随着导航条逐渐展开而排列在一行。

下面的实例演示了这些类型的列表：

 

实例

<h4>有序列表</h4>

<ol>

  <li>Item 1</li>

  <li>Item 2</li>

  <li>Item 3</li>

  <li>Item 4</li>

</ol>

<h4>无序列表</h4>

<ul>

  <li>Item 1</li>

  <li>Item 2</li>

  <li>Item 3</li>

  <li>Item 4</li>

</ul>

<h4>未定义样式列表</h4>

<ul class="list-unstyled">

  <li>Item 1</li>

  <li>Item 2</li>

  <li>Item 3</li>

  <li>Item 4</li>

</ul>

<h4>内联列表</h4>

<ul class="list-inline">

  <li>Item 1</li>

  <li>Item 2</li>

  <li>Item 3</li>

  <li>Item 4</li>

</ul>

<h4>定义列表</h4>

<dl>

  <dt>Description 1</dt>

  <dd>Item 1</dd>

  <dt>Description 2</dt>

  <dd>Item 2</dd>

</dl>

<h4>水平的定义列表</h4>

<dl class="dl-horizontal">

  <dt>Description 1</dt>

  <dd>Item 1</dd>

  <dt>Description 2</dt>

  <dd>Item 2</dd>

</dl>