本文主要介绍html中有序列表标签ol,li的高级应用,

　　在网页设计时我们设计有序列表内容时，经常会在每个ITEM前手工加上一个数值，或是由程序加上这个数值。

　　而如果使用有序列表标签ol和li，则不需要这么麻烦，根本不用自行去填写序数，当单层列表的时候这种特性似乎并不明显，而当使用多层的时候其特性就很明显了。

　　一般的标签ol和li有序列表应用代码如下：

 <ol>

<li>列表内容一</li>

<li>列表内容二</li>

<li>列表内容三</li>

<li>列表内容四</li>

<li>列表内容五</li>

</ol>

下面让我们看一下有序列表标签ol,li的高级应用：

改变有序列表的开始值

改变开始值的属性是："start"，下面是序列号从10开始的有序列表示例代码：

 <ol start="">

<li>列表内容一</li>

<li>列表内容二</li>

<li>列表内容三</li>

<li>列表内容四</li>

<li>列表内容五</li>

</ol>

运行代码查看效果：

 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html>

<head>

<title>CSS在线-示例</title>

<style type="text/css">

</style>

</head>

<body>

<ol start="">

<li>列表内容一</li>

<li>列表内容二</li>

<li>列表内容三</li>

<li>列表内容四</li>

<li>列表内容五</li>

</ol>

</body>

</html>

设置有序列表的序号类型

改变编号类型的属性是："type"，type类型有以下几种类型：

A 大写字母 A、B、C、D、E

a 小写字母 a、b、c、c、e

I 大写罗马数字 I、II、III、IV、V

i 小写罗马数字 i、ii、iii、iv、v

1 阿拉伯数字 1、2、3、4、5

下面是序列号类型是大写字母的有序列表示例代码：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html>

<head>

<title>CSS在线-示例</title>

<style type="text/css">

</style>

</head>

<body>

<ol type="A">

<li>列表内容一</li>

<li>列表内容二</li>

<li>列表内容三</li>

<li>列表内容四</li>

<li>列表内容五</li>

</ol>

</body>

</html>

html中有序列表标签ol,li的高级应用的更多相关文章

  1. （三）HTML中的列表标签、框架集及表单标签

    一.HTML的列表标签 在网页中,经常可以看到,有的内容排列如同word里面的项目编号,这就是HTML的无序排列和有序排列起到的作用.. HTML之无序排列:<ul></ul> ...

  2. html中的列表标签

    1.<dl>定义列表,<dt>定义列表中的项目,<dd>对项目的描述 例: 效果: 2.<ul>无序列表,<li>列表项 例: 效果: 3. ...

  3. Markdown中有序列表和无序列表

    最近有用户问我,在简书写 Markdown, 一条有序列表 item 之后接一条无序列表 item,为什么 parse 的结果,第二个 item 依旧是作为有序列表的第二项显示,带有有序列表的列表符号 ...

  4. Redis中有序列表(ZSet)相关命令

    redis语序集合和集合set是一样内部value为string类型的集合,有序不允许重复元素 但是,zset的每个元素有一个double类型的分数(score).redis正是靠这个分数对元素从小到 ...

  5. DIV+CSS中标签ul ol li dl dt dd用法

    ul ol li dl dt dd都是DIV+CSS做网页长用的东西,相当于一棵树的树技,下面就了解一下这些东西的全体用法,本人用dd,dt,dd用得很少,懂得结合使用对做架构是很有好处的哦! DIV ...

  6. HTML中的ul, ol,li , dl,dt, dd标签

    ul: unordered lists ol: ordered lists li: Lists ol 有序列表. <ol><li>……</li><li> ...

  7. Div+css中ul ol li dl dt dd使用

    ol 有序列表.<ol><li>……</li><li>……</li><li>……</li></ol>表现 ...

  8. ol,li,ul,dl,dt,dd

    块级元素div尽量少用,其实和table一样,嵌套越少越好,它也是会影响速度的! ol 有序列表. <ol> <li>……</li> <li>……< ...

  9. HTML 中的 dl(dt,dd)、ul(li)、ol(li)

    HTML <dl> 标签 #定义和用法 <dl> 标签定义了定义列表(definition list). <dl> 标签用于结合 <dt> (定义列表中 ...

随机推荐

  1. leetcode146周赛-1131-绝对值表达式的最大值

    题目描述: class Solution: def maxAbsValExpr(self, arr1, arr2) -> int: def function(s1,s2): result1=[] ...

  2. Linux命令查看文件内容

    cat:一次性顺序显示文件所有内容和 cat filename tac:一次性倒序显示文件所有内容和 tac filename head:显示文件开头的若干行内容 head -n filename t ...

  3. mysql 一次性插入的数据量过大报错max_allowed_packet解决方法

    查询: show VARIABLES like ‘%max_allowed_packet%‘; 记录下数字(默认是一个7位) 执行语句: ; 重启服务 再查询 该数字 ,如果没变,则修改mysql的m ...

  4. Android 学习 (持续添加与更新)

    N.GitHub 最受欢迎的开源项目 http://www.csdn.net/article/2013-05-03/2815127-Android-open-source-projects 六.and ...

  5. SpringBoot学习笔记（六）：SpringBoot实现Shiro登录控制和权限控制

    登录模块:在登录时必须调用 授权模块:不是一登录就调动,而是当角色权限控制时才会调用 登录控制 环境搭建在上一篇. 数据库表 表名:role 字段:id rolename 表名:user 字段:id ...

  6. 用docker部署zabbix

    官方文档 https://www.zabbix.com/documentation/3.4/zh/manual/installation/containers 1 启动一个空的Mysql服务器实例 d ...

  7. 第二周——1.项目中MySQL版本问题

    1.版本升级 经组长推荐,本地安装的是mysql-8.0.11,而主项目用的还是版本5.6, 因此需要升级版本. 首先,更新驱动:下载mysql-connector-java-8.0.11,将E:\P ...

  8. Python实例2-逗号代码

    假定有下面这样的列表: spam = ['apples', 'bananas', 'tofu', 'cats'] 编写一个函数,它以一个列表值作为参数,返回一个字符串.该字符串包含所有表项,表项之间以 ...

  9. Vuejs之Component slot 插槽详解

    Vuejs的component的数据进行了沙箱隔离,除js全局变量如Math, Date之类外无法访问用户自定义的变量,所以使用component写组件或嵌套组件时明白变量的访问非常重要 编译作用域 ...

  10. 联想 Z470个人安装黑苹果参考

    笔记本是联想 Z470,cpu i3-2350M 傻瓜图文式]Win系统下制作U盘CLOVER引导 EDIT部分 进去黑屏 U盘引导盘