首页>>网站建设>>Javascript>>经验笔记

在CSS中有两种列表，即有序列表及无序列表，在CSS样式中可以设置这两种列表的项目标记类型，项目标记图像以及项目标记的位置。

一、设置列表项标记类型

在CSS中设置列表项标记的属性是list-style-type，它的取值有很多中，如circle空心圆，square实心方块等，语法如下：

ul.a {list-style-type: circle;}
ul.b {list-style-type: square;}

二、设置列表项标记为图像

在CSS中，可以设置列表的项标记为图像（当然不要太大，与原配大小不大，不然影响美观），使用的属性是：list-style-image，语法如下：

ul
{
    list-style-image: url('sqpurple.gif');
}

其中url('sqpurple.gif')是项目标记图像。

三、设置列表项标记位置

在CSS中设置列表的项标记位置的属性是list-style-position，其值有两种，一种是inside另一种的outside，区别如下：



语法如下：

ul {
    list-style-position: inside;
}

四、属性简写

属性简写使用的是：

ul
{
    list-style: square url("sqpurple.gif");
}

其中设置顺序是：

1、list-style-type

2、list-style-position

3、list-style-image

列表属性一览表：

序号	属性	描述
1	list-style	列表的简写属性
2	list-style-image	设置列表项标记为图像
3	list-style-postion	设置列表项标记的位置
4	list-style-type	设置列表项标记的类型

学习不止眼前的教程与笔记还需实践与创新——小伙伴们块动手试试吧~