实例代码：
<!doctype html>
<head>
<meta charset="utf-8">
<style type="text/css">
ol.one{list-style-type:decimal;}
ol.two{list-style-type:lower-roman;}
ol.three{list-style-type:upper-roman;}
ol.four{list-style-type:lower-alpha;}
ol.five{list-style-type:upper-alpha;}
table,th,td{border:1px solid black;border-collapse:collapse; }
td,th{width:120px;}
th{padding:5px;color:red;}
</style>
</head>
<html>
<body>
<h1>有序列表样式实例</h1>
<table>
<tr>
<th>数字</th>
<th>小阿拉伯</th>
<th>大阿拉伯</th>
<th>小写</th>
<th>大写</th>
</tr>
<tr>
<td>
<ol class="one">
<li>苹果</li>
<li>香蕉</li>
<li>雪梨</li>
</ol>
</td>
<td>
<ol class="two">
<li>咖啡</li>
<li>奶茶</li>
<li>可乐</li>
</ol>
</td>
<td>
<ol class="three">
<li>苹果</li>
<li>香蕉</li>
<li>雪梨</li>
</ol>
</td>
<td>
<ol class="four">
<li>咖啡</li>
<li>奶茶</li>
<li>可乐</li>
</ol></td>
<td>
<ol class="five">
<li>红茶</li>
<li>绿茶</li>
<li>普尔茶</li>
</ol>
</td>
</tr>
</table>
</body>
</html>
运行效果:
评论