image.png
image.png
- 13.HTML5列表的使用.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>13.HTML5列表的使用</title>
</head>
<body>
<!--無(wú)序-->
<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>
<!--無(wú)序 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>動(dòng)漫</li>
<ul>
<li>死神</li>
<li>銀魂</li>
</ul>
<li>風(fēng)景</li>
<ul>
<li>青山</li>
<li>綠水</li>
</ul>
<li>建筑</li>
<ul>
<li>高樓</li>
<li>大廈</li>
</ul>
</ul>
<br/>
<!--嵌套列表-->
<ol>
<li>動(dòng)漫</li>
<ol>
<li>死神</li>
<li>銀魂</li>
</ol>
<li>風(fēng)景</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>
