HTML5 笔记2 — ol加强属性start、reversed

最新推荐文章于 2024-10-16 19:24:07 发布

原创最新推荐文章于 2024-10-16 19:24:07 发布 · 1.8k 阅读

7 ·

CC 4.0 BY-SA版权

html5+css3 专栏收录该内容

20 篇文章

订阅专栏

1.ol加强属性–start属性来定义标号开始值

这里写图片描述

通过给ol标签添加属性start来设置有序列表的开始值，如下：表示列表从3开始排列。

<ol start="3">
   <li><a href="#">有序列表A</a></li>
   <li><a href="#">有序列表B</a></li>
   <li><a href="#">有序列表C</a></li>
   <li><a href="#">有序列表D</a></li>
</ol>

也可以从A、B、C、D进行排序需要给ol添加type,如下：

这里写图片描述

type=”A”表示字母排序，start=”3” 表示从第三个字母开始排序。

<ol start="3" type="A">
   <li><a href="#">有序列表A</a></li>
   <li><a href="#">有序列表B</a></li>
   <li><a href="#">有序列表C</a></li>
   <li><a href="#">有序列表D</a></li>
</ol>

同理，也可以从 “I” 排序：

这里写图片描述

<ol start="1" type="I">
   <li><a href="#">有序列表A</a></li>
   <li><a href="#">有序列表B</a></li>
   <li><a href="#">有序列表C</a></li>
   <li><a href="#">有序列表D</a></li>
</ol>

2. ol加强属性–reversed来进行反向编号

这里写图片描述

reversed是用来反向编号，倒着数。同时可以和start一起使用。

<ol reversed="reversed" >
   <li><a href="#">有序列表A</a></li>
   <li><a href="#">有序列表B</a></li>
   <li><a href="#">有序列表C</a></li>
   <li><a href="#">有序列表D</a></li>
   <li><a href="#">有序列表E</a></li>
</ol>