<ol>

HTML<ol>表示多个有序列表项，通常渲染为有带编号的列表。

浏览器支持

目前大多数浏览器支持<ol>标签。

示例

简单示例

<ol>
  <li>first item</li>
  <li>second item</li>
  <li>third item</li>
</ol>

以上 HTML 输出如下：

标签定义及使用说明

• <ol>标签定义了一个有序列表。列表排序以数字来显示。请使用<ul>标签定义无序列表，使用<li>标签来定义列表选项。使用 CSS 来定义列表样式。
• 通常，有序列表条目和它前面的编号一起显示，它的编号可以是任何形式，如数字、字母或者罗马数字，甚至可以是小子弹。而这种样式（小子弹）并没有在 HTML 页面内定义，而是在其关联的 CSS 中，使用了list-style-type属性。
• HTML 并没有对<ol>和<ul>元素的深度和反复使用次数（overlap）作出限制。
• <ol>和<ul>都是列表项。它们的不同点在于<ol>元素里条目的顺序是有意义的。对于该选择哪一个去使用下面有个建议：尝试去更改列表项的顺序，如果其含义改变了，那么应该使用<ol>元素，否则使用<ul>更合适。

• 内容分类流内容, and if the<ol>element's children include at least one<li>element, 段落内容元素.
• 允许的内容一个或多个<li>元素。这些<li>元素可以再包含嵌套的<ol>或<ul>元素。
• 标签省略不允许，开始标签和结束标签都不能省略。
• 允许的父元素任何接受流内容的元素流内容.
• Permitted ARIA rolesdirectory,group,listbox,menu,menubar,radiogroup,tablist,toolbar,tree,presentationDOM 接口HTMLOListElement

属性

这个元素包含全局属性.

• compact这个是布尔属性，规定了列表要用紧凑的方式渲染。这个属性的具体渲染方式由客户端决定，并不能被所有浏览器支持决定。Note:不要使用这个属性，这个属性已经过时：<ol>元素的样式应当使用CSS来控制，想要获得和这个属性相似的效果，使用CSS属性line-height并设置值为80%.
• reversedHTML5
  这个布尔属性规定了列表的条目采用倒序，即最不重要的条目放在列表第一个位置。
• startHTML5
  这是整数属性，规定了列表得条目序号的开始的值。尽管列表条目的序号可能是罗马字母顺序，如XXXI，或者字母，这个开始的顺序总是使用数字表示。比如想要元素序号从字母“C”开始，使用<ol start="3">。

  Note:这个属性在 HTML4中弃用，但是在 HTML5 中被重新引入。

• type编号类型:
  • 'a'表示小写字母编号；
  • 'A'表示大写字母编号；
  • 'i'表示小写罗马数字编号；
  • 'I'表示大写罗马数字编号；
  • '1'表示数字编号（默认值）。

  除非在封闭的<li>元素中使用不同的type属性，否则类型集将用于整个列表。

  Note:这个属性在 HTML4中弃用，但是在 HTML5 中被重新引入。除非列表中序号很重要（比如，在法律或者技术文件中条目通常被需要所引用），否则请使用 CSS list-style-type属性替代。

HTML 4.01 与 HTML 5 之间的差异

在 HTML 4.01 中，不赞成使用"start"属性，在 HTML 5 中是允许的。

在 HTML 4.01 中，不赞成使用"compact"和"type"属性，在 HTML 5 中，不再支持这两个属性。

HTML 4.01 与 HTML5中的差异

在 HTML 4.01 中"start"和"type"属性已经废弃，HTML5不支持该属性。

"reversed"属性是 HTML5 中的新属性。

在HTML 4.01中"compact"属性已经废弃，在 HTML5中不支持该属性。

全局属性

<ol>标签支持全局属性，查看完整属性表HTML全局属性。

事件属性

<ol>标签支持所有HTML事件属性。

例子

<ol>
   <li>coffee</li>
   <li>tea</li>
</ol>
<ol>
   <li start="60">coffee</li>
   <li>tea</li>
</ol>

实例

2 个不同的有序列表实例：

<ol>
<li>coffee</li>
<li>tea</li>
<li>milk</li>
</ol>
<ol start="50">
<li>coffee</li>
<li>tea</li>
<li>milk</li>
</ol>

使用start属性

<ol start="7">
  <li>first item</li>
  <li>second item</li>
  <li>third item</li>
</ol>

以上 HTML 输出如下：

嵌套列表

<ol>
  <li>first item</li>
  <li>second item      <!-- look, the closing </li> tag is not placed here! -->
    <ol>
      <li>second item first subitem</li>
      <li>second item second subitem</li>
      <li>second item third subitem</li>
    </ol>
  </li>                <!-- here is the closing </li> tag -->
  <li>third item</li>
</ol>

以上 HTML 输出如下：

嵌套<ol>和<ul>

<ol>
  <li>first item</li>
  <li>second item      <!-- look, the closing </li> tag is not placed here! -->
    <ul>
      <li>second item first subitem</li>
      <li>second item second subitem</li>
      <li>second item third subitem</li>
    </ul>
  </li>                <!-- here is the closing </li> tag -->
  <li>third item</li>
</ol>

以上 HTML 输出如下：