HTML实例-067 HTML的不同类型的有序列表

hrs 提交于 2019/11/13 - 15:01 , 周三

这一节我们来学习一下,不同列表的符号,利用type 属性的值改变输出的结果。

实例代码:

<!doctype html>
<head>
<meta charset="utf-8">
</head>

<html>
	<body>
	<h2>不同类型的有序列表</h2>
	<table border="1">
		<tr>
			<th>数字列表</th>
			<th>字母列表</th>
			<th>小写字母列表</th>
		</tr>
		<tr>
		<td>
		<ol>
			<li>苹果</li>
			<li>香蕉</li>
			<li>芒果</li>
		</ol>
		</td>
		<td>
		<ol type="A">
			<li>苹果</li>
			<li>香蕉</li>
			<li>芒果</li>
		</ol>
		</td>
		<td>
		<ol type="a">
			<li>苹果</li>
			<li>香蕉</li>
			<li>芒果</li>
		</ol>
		</td>

		</tr>
		<tr>
			<th>罗马字母列表</th>
			<th>小写罗马字母列表</th>
			<th>改变起始值</th>
		</tr>
		<tr>
		<td>
		<ol type="I">
			<li>苹果</li>
			<li>香蕉</li>
			<li>芒果</li>
		</ol>
		</td>
		<td>
		<ol type="i">
			<li>苹果</li>
			<li>香蕉</li>
			<li>芒果</li>
		</ol>
		</td>
		<td align="center">
		start="值"<br />
		例如:<br/>
		start="50"
		</td>
		</tr>
		</table>
	</body>
</html>

运行效果:

html_067.png

从这个实例中看出,我们用一个两行三列的表格,来演示不同类型的有序列表。

type="A"  表示输出大写字母

type="a"  表示输出小写字母

type="I"  表示输罗马字母

type="i"  表示输出小写罗马字母

start="50"  表示输出50开始的序号

 

 

标签