当前位置:   article > 正文

html中dl ul ol,html几种列表介绍,
    ,
      ,
      ,

1.dl:definition lists,自定义列表    列表中每个元素的标题使用

(definition term)定义,后面跟随(definition description)用于描述列表中元素的内容.

2.ul:unordered lists,无序列表    每一列使用

(list item)标签定义,"列表项"的意思

3.ol:ordered lists,有序列表    每一列使用

标签(与无序列表相同)定义,每列使用数字或字母开头.

4.nl:navigation lists,导航列表

使用nl导航的内容,可以使用label对内容说明

几种标签的style说明:

1.list-style-type -- 定义列表样式

取值:disc | circle | square | decimal | decimal-leading-zero | lower-roman | upper-roman | lower-greek | lower-latin | upper-latin | armenian | georgian | lower-alpha |             upper-alpha | none | inherit

disc: 点

circle: 圆圈

square: 正方形

decimal: 数字

decimal-leading-zero: 十进制数,不足两位的补齐前导0,例如: 01, 02, 03, ..., 98, 99

lower-roman: 小写罗马文字,例如: i, ii, iii, iv, v, ...

upper-roman: 大写罗马文字,例如: I, II, III, IV, V, ...

lower-greek: 小写希腊字母,例如: α(alpha), β(beta), γ(gamma), ...

lower-latin: 小写拉丁文,例如: a, b, c, ... z

upper-latin: 大写拉丁文,例如: A, B, C, ... Z

armenian: 亚美尼亚数字

georgian: 乔治亚数字,例如: an, ban, gan, ..., he, tan, in, in-an, ...

lower-alpha: 小写拉丁文,例如: a, b, c, ... z

upper-alpha: 大写拉丁文,例如: A, B, C, ... Z

none: 无(取消所有的list样式)

inherit:继承

初始值: disc

2.list-style-image -- 定义列表样式图片

取值: | none | inherit

:URI(一般是一个图片的网址)

none:无

inherit:继承

初始值: none

继承性: 是

适用于: 所有属于list的元素

list:列表,style:样式,image:图片.

示例:

ul

{

list-style-image:url("/images/list-orange.png");

}

3.list-style-position -- 定义列表样式的位置

取值: inside | outside | inherit         inside: 内部         outside: 外部         inherit: 继承     初始值: outside     继承性: 是     适用于: 所有属于list的元素     list: 列表,style: 样式,position: 位置.     示例:    ul#inside    {      list-style-position:inside;      list-style-image:url("/images/list-orange.png");     }

声明:本文内容由网友自发贡献,不代表【wpsshop博客】立场,版权归原作者所有,本站不承担相应法律责任。如您发现有侵权的内容,请联系我们。转载请注明出处:https://www.wpsshop.cn/w/繁依Fanyi0/article/detail/328707
推荐阅读
相关标签
  

闽ICP备14008679号