实例一：有序列表，无序列表，<dl>，<dt>,<dd>,div块级标签
<!DOCTYPE html><html lang="en"><head> ???<meta charset="UTF-8"> ?<meta http-equiv="content-type" content="text/html;charset=gb2312"><!--固定写发，指定网页是是用什么格式来解析的--> ?<meta name="authoe" content="李强" /><!--authoe:表示作者，叫李强--> ???<title>第一个网页文件</title> ?<meta name="Description" content="李强的第一个站点"/><!--网页描述--> ?<meta name="website" content="wwww.baidu.com"/><!--设置网址--> ???<meta name="keywords" content="wbb前端页面"/><!--浏览器搜索的关键字--></head><body><div id="MP3板块"><!--模块标签--> ?<h1>MP3排行榜</h1> ?<hr/><!--横线--> ?<h2>歌曲目录</h2> ?<p><strong>第一名：桃花朵朵开</strong></p><!--粗体--> ?<p>第二名：死了都要爱</p> ?<p>第三名：你是我的小苹果</p> ?<hr/></div><div id="水果排序板块"> ?<h3>喜欢吃的水果排名</h3> ?<ol><!--有序列表--> ???<li><em>梨子</em></li><!--斜体表示强调--> ???<li>香蕉</li> ???<li>葡萄</li> ?</ol></div><div id="旅游线路板块"> ?<h3>旅游路线精选</h3> ?<hr/> ?<ul><!--无需标签--> ???<li><i>杭州-上海-天津</i></li><!--斜体--> ???<li>杭州-南京-上海</li> ???<li>杭州-丽江-厦门</li> ?</ul><hr/></div><div id="其他板块"><dl> ?<dt>水</dt><!--描述的标题--> ???<dd>符号：H<sub>2</sub>O<dd/><!--描述的内容，sub表示上标签--> ???<dd>生命之源</dd> ?<dt>氧气</dt> ?<dd>符号：O<sup>2</sup></dd><!--下标签--> ?<dd>生命制服</dd> ?<dt>强哥</dt> ?<dd>称呼：大家叫我帅哥</dd> ?<dd>称呼：<bdo dir="rtl">大家叫我帅哥</bdo></dd><!--表示读取的顺序从那边到那边--></dl><!--列表描述标签--></div><hr/><div id="footer"> ?<a href="http://www.cnblogs.com/insane-Mr-Li/" target="_self">我的博客</a><!--超链接标签，_self表示在自身这个网页打开冲掉之前的那个网页，_blank表示重新打开一个网页--> ? ©版权所有<!--nbsp空格--> ?<p><a href="http://www.cnblogs.com/insane-Mr-Li/" target="_blank"> " <img src="logo.gif" alt="图片不存在" /></a></p><!--给图片加上超链接--></div></body></html>
HTML实例（四）
原文地址：https://www.cnblogs.com/insane-Mr-Li/p/9201260.html