列表
Type=1 | 表示列表项目用数字表示(1,2,3…..) |
Type=a | 表示列表项目用小写字母表示(a,b,c..) |
Type=A | 表示列表项目用大写字母表示(A,B,C..) |
Type=i | 表示列表项目用小写罗马数字表示(i,ii,iii….) |
Type=I | 表示列表项目用大写罗马数字表示(I,II,III…) |
<ol type=value1 start=value2>
start是编号开始的数字,如start=2则编号从2开始,如果从1开始可以省略。value2表示项目开始的数值。
<ol type="a" start="5" reversed> 反序
类型
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>你好(runoob.com)</title>
</head>
<body>
<h4>编号列表:</h4>
<ol>
<li>Apples</li>
<li>Bananas</li>
<li>Lemons</li>
<li>Oranges</li>
</ol>
<h4>大写字母列表:</h4>
<ol type="A">
<li>Apples</li>
<li>Bananas</li>
<li>Lemons</li>
<li>Oranges</li>
</ol>
<h4>小写字母列表:</h4>
<ol type="a">
<li>Apples</li>
<li>Bananas</li>
<li>Lemons</li>
<li>Oranges</li>
</ol>
<h4>罗马数字列表:</h4>
<ol type="I">
<li>Apples</li>
<li>Bananas</li>
<li>Lemons</li>
<li>Oranges</li>
</ol>
<h4>小写罗马数字列表:</h4>
<ol type="i">
<li>Apples</li>
<li>Bananas</li>
<li>Lemons</li>
<li>Oranges</li>
</ol>
</body>
</html>
无序列表中type属性的常用值有三个,它们呈现的效果不同:
小黑点:disc(默认值);
方块:square;
空心圆:circle。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>您好(runoob.com)</title>
</head>
<body>
<p><b>注意:</b> 在 HTML 4中 ul 属性已废弃,HTML5 已不支持该属性,因此我们使用 CSS 代替来定义不同类型的无序列表如下:</p>
<h4>圆点列表:</h4>
<ul style="list-style-type:disc">
<li>Apples</li>
<li>Bananas</li>
<li>Lemons</li>
<li>Oranges</li>
</ul>
<h4>圆圈列表:</h4>
<ul style="list-style-type:circle">
<li>Apples</li>
<li>Bananas</li>
<li>Lemons</li>
<li>Oranges</li>
</ul>
<h4>正方形列表:</h4>
<ul style="list-style-type:square">
<li>Apples</li>
<li>Bananas</li>
<li>Lemons</li>
<li>Oranges</li>
</ul>
</body>
</html>
自定义列表
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>你好(runoob.com)</title>
</head>
<body>
<h4>一个自定义列表:</h4>
<dl>
<dt>Coffee</dt>
<dd>- black hot drink</dd>
<dt>Milk</dt>
<dd>- white cold drink</dd>
</dl>
</body>
</html>