HTML参考手册
标签 | Elements
ol
HTML <ol>
元素代表项目,通常呈现为编号列表的有序列表。
内容类别 |
Flow content, and if the <ol> element's children include at least one <li> element, palpable content. |
---|---|
允许的内容 |
一个或多个 |
标签省略 |
不允许,开始标签和结束标签都不能省略。 |
允许的父元素 |
Any element that accepts flow content. |
允许的 ARIA 角色 |
directory, group, listbox, menu, menubar, radiogroup, tablist, toolbar, tree, presentation |
DOM 接口 |
HTMLOListElement |
属性
这个元素包含全局属性。
compact
这个布尔属性暗示列表应该以紧凑的风格呈现。该属性的解释取决于用户代理,并且不适用于所有浏览器。
注: 不要使用这个属性,这个属性已经过时:<ol>
元素的样式应当使用CSS 来控制,想要获得和这个属性相似的效果,使用 CSS 属性 line-height
并设置值为 80%
。
reversed
HTML5 这个布尔属性规定了列表的条目采用倒序,即最不重要的条目放在列表第一个位置。
start
HTML5 这是整数属性,规定了列表得条目序号的开始的值。尽管列表条目的序号可能是罗马字母顺序,如 XXXI, 或者字母,这个开始的顺序总是使用数字表示。比如想要元素序号从字母 “C” 开始,使用 <ol start="3">。
注:这个属性在 HTML4 中弃用,但是在 HTML5 中被重新引入。
type
指示编号类型:
-
'a'
表示小写字母编号, -
'A'
表示大写字母编号, -
'i'
表示小写罗马数字编号, -
'I'
表示大写罗马数字编号, -
'1'
表示数字编号(默认值)。
这个类型集用于整个列表,除非type
在封闭<li>
元素中使用了不同的属性。
注意:此属性在 HTML4 中已被弃用,但在 HTML5 中重新引入。除非清单号码的价值很重要(例如,在法律或技术文件中的项目将通过其号码/字母引用),则list-style-type
应该使用 CSS 属性。
使用说明
- 通常,有序列表条目和它前面的编号一起显示,它的编号可以是任何形式,如数字、字母或者罗马数字,甚至可以是小子弹。而这种样式(小子弹)并没有在 HTML 页面内定义,而是在其关联的 CSS 中,使用了
list-style-type
属性。 - HTML 并没有对
<ol>
和<ul>
元素的深度和反复使用次数(overlap)作出限制。 -
<ol>
和<ul>
都是列表项。它们的不同点在于<ol>
元素里条目的顺序是有意义的。 对于该选择哪一个去使用下面有个建议:尝试去更改列表项的顺序,如果其含义改变了,那么应该使用<ol>
元素,否则使用<ul>
更合适。
示例
简单示例
<ol>
<li>first item</li>
<li>second item</li>
<li>third item</li>
</ol>
在 HTML 上方输出:
- first item
- second item
- third item
使用罗马数字类型
<ol type="i">
<li>foo</li>
<li>bar</li>
<li>spam</li>
</ol>
上面的 HTML 将输出
i. foo
ii. bar
iii. spam
使用start
属性
<ol start="7">
<li>first item</li>
<li>second item</li>
<li>third item</li>
</ol>
在 HTML 上方输出:
- first item
- second item
- third item
嵌套列表
<ol>
<li>first item</li>
<li>second item <!-- closing </li> tag not here! -->
<ol>
<li>second item first subitem</li>
<li>second item second subitem</li>
<li>second item third subitem</li>
</ol>
</li> <!-- Here's the closing </li> tag -->
<li>third item</li>
</ol>
在 HTML 上方输出:
- first item
- second item
- second item first subitem
- second item second subitem
- second item third subitem
- third item
嵌套 <ol> 和 <ul>
<ol>
<li>first item</li>
<li>second item <!-- closing </li> tag not here! -->
<ul>
<li>second item first subitem</li>
<li>second item second subitem</li>
<li>second item third subitem</li>
</ul>
</li> <!-- Here's the closing </li> tag -->
<li>third item</li>
</ol>
在 HTML 上方输出:
- first item
- second item
- second item first subitem
- second item second subitem
- second item third subitem
- third item
规范
Specification |
Status |
Comment |
---|---|---|
HTML Living StandardThe definition of '<ol>' in that specification. |
Living Standard |
No change since last W3C snapshot, HTML5. |
HTML5The definition of 'HTMLOListElement' in that specification. |
Recommendation |
Added reversed and start attributed; un-deprecated type |
HTML 4.01 SpecificationThe definition of '<ol>' in that specification. |
Recommendation |
Deprecated compact and type. |
浏览器兼容性
Feature |
Chrome |
Edge |
Firefox |
Internet Explorer |
Opera |
Safari |
---|---|---|---|---|---|---|
Basic Support |
(Yes) |
(Yes) |
1 |
(Yes) |
(Yes) |
(Yes) |
compact |
(Yes) |
(Yes) |
1 |
(Yes) |
(Yes) |
(Yes) |
reversed |
18 |
? |
18 |
No |
(Yes) |
5.2 |
start |
(Yes) |
(Yes) |
1 |
(Yes) |
(Yes) |
(Yes) |
type |
(Yes) |
(Yes) |
1 |
(Yes) |
(Yes) |
(Yes) |
Feature |
Android |
Chrome for Android |
Edge mobile |
Firefox for Android |
IE mobile |
Opera Android |
iOS Safari |
---|---|---|---|---|---|---|---|
Basic Support |
(Yes) |
(Yes) |
(Yes) |
1 |
(Yes) |
(Yes) |
(Yes) |
compact |
(Yes) |
(Yes) |
(Yes) |
1 |
(Yes) |
(Yes) |
(Yes) |
reversed |
(Yes) |
(Yes) |
? |
18 |
No |
(Yes) |
(Yes) |
start |
(Yes) |
(Yes) |
(Yes) |
1 |
(Yes) |
(Yes) |
(Yes) |
type |
(Yes) |
(Yes) |
(Yes) |
1 |
(Yes) |
(Yes) |
(Yes) |
标签 | Elements相关
超文本标记语言,它通过标记符号来标记要显示的网页中的各个部分。网页文件本身是一种文本文件,通过在文本文件中添加标记符,可以告诉浏览器如何显示其中的内容(如:文字如何处理,画面如何安排,图片如何显示等)。浏览器按顺序阅读网页文件,然后根据标记符解释和显示其标记的内容,对书写出错的标记将不指出其错误,且不停止其解释执行过程,编制者只能通过显示效果来分析出错原因和出错部位。但需要注意的是,对于不同的浏览器,对同一标记符可能会有不完全相同的解释,因而可能会有不同的显示效果。