腾讯云618限量抢购
  1. HTML教程

CSS 列表

最后更新:2010-10-07 23:46阅读:17813

CSS 列表

CSS列表用于设置html列表元素(<ul>或<ol>)的属性,该属性为复合属性。

列表标志

“list-style-type”属性用于设置列表标志(项目符号),可能的取值如下:

取值 说明
disc 默认值,实心圆
circle 空心圆
square 实心方块
decimal 阿拉伯数字
lower-roman 小写罗马数字
upper-roman 大写罗马数字
lower-alpha 小写英文字母
upper-alpha 大写英文字母
none 不使用列表标志

例子:

ul li{ list-style-type: square; }

列表图像

CSS允许以图像作为列表标志,“list-style-type”属性用于设置列表图像,取值为url图像。

例子:

ul li{ list-style-image: url(../images/li_red.gif); }

这个是常用的一个装饰列表的好方法。

列表位置

“list-style-position”属性用于设置列表标志出现在列表项内容之外还是内容内部,可能的取值有:

取值 说明
outside 默认值,列表项目标记放置在文本以外,且环绕文本不根据标记对齐
inside 列表项目标记放置在文本以内,且环绕文本根据标记对齐

例子:

ul,ol{ list-style-position: inside; }
腾讯云618限量抢购