image.png
image.png
- 13.HTML5列表的使用.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>13.HTML5列表的使用</title>
</head>
<body>
<!--无序-->
<ul>
<li>苹果1</li>
<li>苹果2</li>
<li>苹果3</li>
</ul>
<!--有序-->
<ol>
<li>榴莲1</li>
<li>榴莲2</li>
<li>榴莲3</li>
</ol>
</body>
</html>
-
效果
image.png
- 13.HTML5列表的使用2.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>13.HTML5列表的使用2</title>
</head>
<body>
<!--无序 type="circle"空心圆 type="square"方块-->
<ul type="circle">
<li>ios</li>
<li>android</li>
<li>html5</li>
<li>swift</li>
</ul>
<br/>
<!--有序 start="10"就是从10开始-->
<ol start="10">
<li>ios</li>
<li>android</li>
<li>html5</li>
<li>swift</li>
</ol>
<br/>
<!--嵌套列表-->
<ul>
<li>动漫</li>
<ul>
<li>死神</li>
<li>银魂</li>
</ul>
<li>风景</li>
<ul>
<li>青山</li>
<li>绿水</li>
</ul>
<li>建筑</li>
<ul>
<li>高楼</li>
<li>大厦</li>
</ul>
</ul>
<br/>
<!--嵌套列表-->
<ol>
<li>动漫</li>
<ol>
<li>死神</li>
<li>银魂</li>
</ol>
<li>风景</li>
<ol>
<li>青山</li>
<li>绿水</li>
</ol>
<li>建筑</li>
<ol>
<li>高楼</li>
<li>大厦</li>
</ol>
</ol>
<dl>
<dt>萨瓦迪卡</dt>
<dd>萨瓦迪卡2</dd>
<dt>萨瓦迪卡</dt>
<dd>萨瓦迪卡2</dd>
<dt>萨瓦迪卡</dt>
<dd>萨瓦迪卡2</dd>
</dl>
</body>
</html>