目录搜索
Attributesaccesskey (attribute)class (attribute)contenteditable (attribute)contextmenu (attribute)data-* (attribute)dir (attribute)draggable (attribute)dropzone (attribute)Global attributeshidden (attribute)id (attribute)itemid (attribute)itemprop (attribute)itemref (attribute)itemscope (attribute)itemtype (attribute)lang (attribute)slot (attribute)spellcheck (attribute)style (attribute)tabindex (attribute)title (attribute)translate (attribute)Elementsaabbraddressareaarticleasideaudiobbasebdibdoblockquotebodybrbuttoncanvascaptioncitecodecolcolgroupdatadatalistdddeldetailsdfndialogdivdldtemembedfieldsetfigcaptionfigurefooterformh1headheaderhrhtmliiframeimginputinput type="button"input type="checkbox"input type="color"input type="date"input type="datetime"-localinput type="email"input type="file"input type="hidden"input type="image"input type="month"input type="number"input type="password"input type="radio"input type="range"input type="reset"input type="search"input type="submit"input type="tel"input type="text"input type="time"input type="url"input type="week"inskbdlabellegendlilinkmainmapmarkmenumenuitemmetameternavnoscriptobjectoloptgroupoptionoutputpparampicturepreprogressqrprtrtcrubyssampscriptsectionselectslotsmallsourcespanstrongstylesubsummarysuptabletbodytdtemplatetextareatfootththeadtimetitletrtrackuulvarvideowbrMiscellaneousAttributesBlock-level elementsCORS enabled imageCORS settings attributesElementInline elementsKinds of HTML contentLink typesMicrodataOptimizing your pages for speculative parsingPreloading contentReferenceSupported media formatsUsing the application cacheObsoleteacronymappletbasefontbigblinkcentercommandcontentdirelementfontframeframesethgroupimageinput type="datetime"isindexkeygenlistingmarqueenextidnoframesplaintextstrikettxmp
文字

HTML <ol>元素代表项目,通常呈现为编号列表的有序列表。

内容类别

Flow content, and if the <ol> element's children include at least one <li> element, palpable content.

允许的内容

一个或多个<li>元素。这些<li>元素可以再包含嵌套的<ol><ul>元素。

标签省略

不允许,开始标签和结束标签都不能省略。

允许的父元素

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 上方输出:

  1. first item

  2. second item

  3. 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 上方输出:

  1. first item

  2. second item

  3. 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 上方输出:

  1. first item

  2. second item

    1. second item first subitem

    2. second item second subitem

    3. second item third subitem

  3. 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 上方输出:

  1. first item

  2. second item

    • second item first subitem

    • second item second subitem

    • second item third subitem

  3. 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)

上一篇:下一篇: