CSS 4.2.4参考手册
目录搜索
提交中...

©
本文档使用 php.cn手册 发布

文字
分享

语法：

list-style：<' list-style-type '> || <' list-style-position '> || <' list-style-image '>

默认值：看独立属性自身

适用于：所有 <' display '> 设置为list-item的元素

继承性：有

动画性：否

计算值：看独立属性自身

取值：

  • <' list-style-type '>：设置或检索对象的列表项所使用的预设标记

  • <' list-style-position '>：设置或检索作为对象的列表项标记如何根据文本排列

  • <' list-style-image '>：设置或检索作为对象的列表项标记的图像

说明：

复合属性。设置列表项目相关内容

  • 需要注意的是，如果使用 <' list-style '> 复合属性，<' list-style-image '> 属性必须放在最后，否则部分浏览器（包括所有的webkit/blink内核浏览器）将会解析出错。

  • 对应的脚本特性为listStyle。

兼容性：

ValuesIEFirefoxChromeSafariOperaiOS SafariAndroid BrowserAndroid Chrome
Basic Support6.0+2.0+4.0+6.0+15.0+6.0+2.1+18.0+

示例：

实例

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

<!DOCTYPE html>

<html lang="zh-cmn-Hans">

<head>

<meta charset="utf-8" />

<title>list-style_CSS参考手册_web前端开发参考手册系列</title>

<meta name="author" content="Joy Du(飘零雾雨), dooyoe@gmail.com, www.doyoe.com" />

<style>

.test{list-style:upper-alpha outside none;}

</style>

</head>

<body>

<ul class="test">

    <li class="colorname">列表项一</li>

    <li class="colorname">列表项一</li>

    <li class="colorname">列表项一</li>

    <li class="colorname">列表项一</li>

</ul>

</body>

</html>

            


运行实例 »

点击 "运行实例" 按钮查看在线实例

上一篇：列表下一篇：list-style-image