一、作品展示

二、文件目录

三、代码实现

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>我的个人主页</title><script src="/common/qihoo_ie6_tips.js"></script><style type="text/css">body{margin:0px;padding:0px;font-size:12px;text-decoration:none;background-color:#E9E9E9;background-image:url(images/bg.gif);background-repeat:repeat-x;}</style><link rel="stylesheet" type="text/css" href="css/css.css" /></head><body><div class = "content"><div class ="top"></div><div class = "nav"></div><div class ="Navigation_bar"><ul><li class = "kuai"><a href="index.html">首页</a></li><li class = "kuai"><a href="h_arcticle.html">我的家乡</a></li><li class = "kuai"><a href="f_arcticle.html">我的母校</a></li><li class = "kuai"><a href="list.html">我的文章</a></li><li class = "kuai"><a href="p_arcticle.html">我的相册</a></li></ul></div><div class = "nav"></div><div class = "showpic"><object codebase="/pub/shockwave/cabs/flash/swflash.cab#version=7,0,19,0" width="960" height="150" classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"><param name="movie" value="swf/Currencyshow.swf?data=xml/index.xml" /><param name="quality" value="high" /><param name="wmode" value="transparent" /><embed src="swf/Currencyshow.swf?data=xml/index.xml" wmode="transparent" quality="high" pluginspage="/go/getflashplayer" type="application/x-shockwave-flash" width="960" height="150"></embed></object><div ></div></div><div class = "nav"></div><div class = "main"><div class = "left"><div class = "title"><span style="float:left; margin-top:15px;"><img src="images/myhometown.jpg" alt="我的家乡" name="link" width="180" height="21" id="link" /></span></div><div class = "nav"></div><div class = "index_list">    长清是正在崛起的西部新城。6月省委常委扩大会议确定了济南“东拓、西进、南控、北跨、中疏”的城市发展总体战略，其中“西进”是指加快开发以济南经济开发区、大学科技园和长清主城区为主的“西部片区”。在此基础上，我们确定了“两轴五组团”的城市发展空间结构，即以自然山体、水系和交通走廊为主线，进一步细划为长清主城区、大学科技园区、经济开发区、农业高新技术开发区和五峰山旅游度假区五个功能不同、风格迥异的城市组团，从而形成沿经十路连接经济开发区和长清城区的经济、社会、生态、城市发展轴: …… <br></div><span style="float:right;padding-top:70px;"><a href="h_arcticle.html"><img src="images/more.jpg" border="0" /></a></span></div><div class = "middle"><div class = "title"><span style="float:left; margin-top:15px"><img src="images/mymotherschool.jpg" alt="我的母校" name="link" width="180" height="21" id="link" /></span></div><div class = "nav"></div><div class = "index_list">    济南市长清第一中学位于风景秀丽、人文荟萃、经济发达的济南市长清区，其源于1904年创建的县立高等学堂，迄今已有一百零五年的历史。目前，学校分东西两个校区，占地361亩，建筑面10万平方米，学校现有100多个高初中教学班，在校生6000余人。长清一中是省级规范化学校，济南市重点中学，长清区窗口单位、教育龙头学校 …… </div><span style="float:right;padding-top:70px; "><a href="f_arcticle.html"><img src="images/more.jpg" border="0" /></a></span></div><div class = "right"><div class = "title"><span style="float:left;margin-top:15px"><img src="images/myarticle.jpg" alt="我的文章" name="link" width="180" height="21" id="link" /></span></div><div class = "nav"></div><ul style="line-height:10px;"><li class = "list_right"><a href="arcticle.html">自我介绍</a><span style="float:right;">-13-21</span></li><li class = "list_right"><a href="/my/Article.asp?id=5">重装系统就是这么简单 </a><span style="float:right;">-13-21</span></li><li class = "list_right"><a href="/my/Article.asp?id=4">解决输入法问题 </a><span style="float:right;">-13-21</span></li><li class = "list_right"><a href="/my/Article.asp?id=3">电脑分区 </a><span style="float:right;">-13-21</span></li><li class = "list_right"><a href="/my/Article.asp?id=2">xp系统设置开机密码 </a><span style="float:right;">-13-21</span></li><li class = "list_right"><a href="/my/Article.asp?id=15">的来历？ </a><span style="float:right;">-13-21</span></li><li class = "list_right"><a href="/my/Article.asp?id=80">德州学院失物招领平台</a><span style="float:right;">-13-21</span></li></ul><span style="float:right;padding-top:70px; "><a href="list.html"><img src="images/more.jpg" border="0" /></a></span></div></div><div class = "nav"></div><div class = "group"><a href="#"><img src="images/major-by-1.jpg" alt="一组" width="113" height="45" border="0" id="link" /></a>  <a href="#"><img src="images/major-by-2.jpg" alt="二组" name="link" width="113" height="45" border="0" id="link" /></a>  <a href="#"><img src="images/major-by-3.jpg" alt="三组" name="link" width="113" height="45" border="0" id="link" /></a>  <a href="#"><img src="images/major-by-4.jpg" alt="四组" name="link" width="113" height="45" border="0" id="link" /></a>  <a href="#"><img src="images/major-by-5.jpg" alt="五组" name="link" width="113" height="45" border="0" id="link" /></a>  <a href="#"><img src="images/major-by-6.jpg" alt="六组" name="link" width="113" height="45" border="0" id="link" /></a>  <a href="#"><img src="images/major-by-7.jpg" alt="七组" name="link" width="113" height="45" border="0" id="link" /></a>  </div><div class = "nav"></div><div class = "link_bar"><div ><select name="friendLink" onchange="if(this.options[this.selectedIndex].value!='yqlj'){window.open(this.options[this.selectedIndex].value,'_blank')}" style="width:118px;"><option selected="selected" value="yqlj">友情链接</option><option target='_blank' value=''>无声工作室</option><option target='_blank' value='http://211.64.32.1'>德州学院</option><option target='_blank' value=''>山东高考信息网</option></select><a href=""><img src="images/novice.jpg" alt="无声" name="link" width="107" height="34" border="0" id="link" /></a>  <a href="http://211.64.32.1/"><img src="images/dzu.jpg" alt="友情链接" name="link" width="107" height="34" border="0" id="link" /></a>  <a href=""><img src="images/sdbk.jpg" alt="友情链接" name="link" width="107" height="34" border="0" id="link" /></a>  <a href="#"><img src="images/yq.jpg" alt="友情链接" name="link" width="107" height="34" border="0" id="link" /></a>  <a href="#"><img src="images/yq.jpg" alt="友情链接" name="link" width="107" height="34" border="0" id="link" /></a></div></div><div class = "nav"></div><div class = "line"></div><div class = "nav"></div><div class = "nav"></div><div class = "foot_line"></div></div><script type="text/javascript">var jiathis_config = {data_track_clickback:true};</script><script type="text/javascript" src="/code/jiathis_r.js?move=0&uid=1335754376897194" charset="utf-8"></script></body></html>

四、获取更多源码

~ 关注我，点赞博文~ 每天带你涨知识!

相关问题可以相互学习，可关注↓公Z号获取更多源码