CSS控制列表样式有几种属性?

22 篇文章 1 订阅

定义无序或有序列表时,可以通过标记的属性控制列表的项目符号,但是这种方式实现的效果只是经典效果,难以适应风格各异的页面效果。为此,CSS提供了4个列表样式的属性,本节将对这些属性进行详细讲解。

1. list-style-type属性

在CSS中,list-style-type属性用于控制列表项显示符号的类型,其取值有多种,它们的显示效果不同,具体如表所示。

注意:各个浏览器对list-style-type属性的解析不同。因此,在实际网页制作过程中不推荐使用list-style-type属性。

2. list-style-image属性

一些常规的列表项显示符号并不能满足网页制作的需求,为此CSS提供了list-style-image属性,其取值为图像的url(地址)。使用list-style-image属性可以为各个列表项设置项目图像,使列表的样式更加美观。

3. list-style-position属性

设置列表项目符号时,有时需要控制列表项目符号的位置,即列表项目符号相对于列表项内容的位置。在CSS中,list-style-position属性用于控制列表项目符号的位置,其取值有inside和outside两种,对它们的解释如下。

•inside:列表项目符号位于列表文本以内。

•outside:列表项目符号位于列表文本以外(默认值)。

4. list-style属性

在CSS中列表样式也是一个复合属性,可以将列表相关的样式都综合定义在一个复合属性list-style中。使用list-style属性综合设置列表样式的语法格式如下:

list-style:列表项目符号列表项目符号的位置列表项目图像;使用复合属性list-style时,通常按上面语法格式中的顺序书写,各个样式之间以空格隔开,不需要的样式可以省略。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值