首页 > 编程 > HTML > 正文

html中ol标签与li标签的高级应用

2020-03-24 16:25:56
字体:
来源:转载
供稿:网友
本文主要介绍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= 10  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= 10  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标签的高级应用的详细内容,html教程

郑重声明:本文版权归原作者所有,转载文章仅为传播更多信息之目的,如作者信息标记有误,请第一时间联系我们修改或删除,多谢。

发表评论 共有条评论
用户名: 密码:
验证码: 匿名发表