CSS自动加序号-多种有序列表数字序号效果

时间：2015-05-24 15:46:47 阅读：198 评论：0 收藏：0 [点我收藏+]

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>CSS自动加序号Ordered List样式</title>
<style type="text/css">
/* list 1 style */
#list1 {
font: italic 1em Georgia, Times, serif;
color: #999999;
}
#list1 p {
font: normal .8em Arial, Helvetica, sans-serif;
color: #000000;
}
/* list 2 styles */
#list2 {
font: italic 1em Georgia, Times, serif;
color: #999;
list-style: lower-roman;
}
#list2 p {
font: normal .85em Georgia, Times, serif;
color: #000;
}
/* list 3 styles */
#list3 {
font: normal 1.1em Arial, Helvetica, sans-serif;
color: #666;
}
#list3 p {
font: normal .7em Arial, Helvetica, sans-serif;
color: #000;
border-left: solid 1px #999;
margin: 0;
padding: 0 0 1em 1em;
}
</style>
</head>
<body>
<div><A href="http://www.999jiujiu.com/">http://www.999jiujiu.com/</A></div>
<ol id="list1">
<li>
<p>显示内容，显示内容，显示内容，显示内容，显示内容，显示内容，显示内容，显示内容，显示内容，显示内容，显示内容，显示内容，显示内容，显示内容，显示内容，显示内容，显示内容，显示内容</p>
</li>
<li>
<p>显示内容，显示内容，显示内容，显示内容，显示内容，显示内容，显示内容，显示内容，显示内容，显示内容，显示内容，显示内容，显示内容，显示内容，显示内容，显示内容，显示内容，显示内容</p>
</li>
<li>
<p>显示内容，显示内容，显示内容，显示内容，显示内容，显示内容，显示内容，显示内容，显示内容，显示内容，显示内容，显示内容，显示内容，显示内容，显示内容，显示内容，显示内容，显示内容</p>
</li>
</ol>
<ol id="list2">
<li>
<p>显示内容，显示内容，显示内容，显示内容，显示内容，显示内容，显示内容，显示内容，显示内容，显示内容，显示内容，显示</p>
</li>
<li>
<p>显示内容，显示内容，显示内容，显示内容，显示内容，显示内容，显示内容，显示内容，显示内容，显示内容，显示内容，显示内容，显示内容，显示内容，显示内容，显示内容，显示内容，显示内容</p>
</li>
<li>
<p>显示内容，显示内容，显示内容，显示内容，显示内容，显示内容，显示内容，显示内容，显示内容，显示内容，显示内容，显示内容，显示内容，显示内容，显示内容，显示内容，显示内容，显示内容</p>
</li>
</ol>
<ol id="list3">
<li>
<p>显示内容，显示内容，显示内容，显示内容，显示内容，显示内容，显示内容，显示内容，显示内容，显示内容，显示内容，显示内容，显示内容，显示内容，显示内容，显示内容，显示内容，显示内容</p>
</li>
<li>
<p>显示内容，显示内容，显示内容，显示内容，显示内容，显示内容，显示内容，显示内容，显示内容，显示内容，显示内容，显示内容，显示内容，显示内容，显示内容，显示内容，显示内容，显示内容
</p>
</li>
<li>
<p>显示内容，显示内容，显示内容，显示内容，显示内容，显示内容，显示内容，显示内容，显示内容，显示内容，显示内容，显示内容，显示内容，显示内容，显示内容，显示内容，显示内容，显示内容</p>
</li>
</ol>
</body>
</html>

标签：css自动加序号-多种有序列表数字序号效

原文地址：http://blog.csdn.net/life66881/article/details/45952121

踩

(0)

评论一句话评论（0）

分享档案

更多>

2021年07月29日 (22)
2021年07月28日 (40)
2021年07月27日 (32)
2021年07月26日 (79)
2021年07月23日 (29)
2021年07月22日 (30)
2021年07月21日 (42)
2021年07月20日 (16)
2021年07月19日 (90)
2021年07月16日 (35)

周排行