第15章 列表

《HTML5与CSS3基础教程》笔记 luoluolzb 浏览1592次

创建列表

使用ol标签创建有序列表、ul标签创建无序列表
使用li标签创建列表项

选择标记

使用list-style-type为列表设置左侧的标记
值:disc(实心圆点) 、circle(空心圆圈)、square(方块)、decimal(数字)、upper-alpha(大写字母)、lower-alpha(小写字母)、upper-roman(大写罗马数字)、lower-roman(小写罗马字母)
none(无标记)
继承的

使用图像作为标记

先对列表标签(ul、ol)使用使用list-style :none; 取消列表标记
对li标签使用background: url(图像url) repeat-type(设为no-repeat) horizontal vertical; 为列表项添加标记
对li标签使用padding-left对文本增加左内距
list-style-position: inside(列表项内) 、outside(列表项外, 默认值);
继承的

同时设置所有列表样式

list-style: type(标记类型, 默认为disc) position(标记位置, 默认outside) image(背景, 默认none);
三个属性顺序任意,可以只指定一个或二个
继承的

设置列表的起始编号

对列表ol标签使用start=n;属性, 设置列表的起始编号
对列表项标签使用value=n;属性, 设置列表项的编号, 其后面的编号也会重编

描述列表

使用dl标签创建描述用于描述术语列表
使用dt标签创建术语
使用dd标签创建术语描述
每个列表都包含在dl中,其中每个名-值都有一个或多个dt元素以及一个或多个dd元素。

本文标签: HTML CSS

版权声明:本文为作者原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。
本文链接:https://luoluolzb.cn/articles/16/chapter-15-list
您需要登录后才发布评论。 点此登录
用户评论 (0条)

暂无评论,赶紧发表一下你的看法吧。