目录【MUNU】
网站策划
页面安排及总体说明
实训网站建设环境
准备工作
效果图
首页效果图
个人简历页面效果图
我的作品页面效果图
联系我们页面效果图
留言板效果图
网页设计源码
网站设计实训心得
页面安排及总体说明
首页
Index
根目录
综合展示网站的内容
我的简历
Jianli
Zone 文件夹
在线展示个人简历的地方
我的作品
Zuopin
Zone 文件夹
展示自己的设计作品
我的地盘
我的相册
xiangce
Zone 文件夹
用来展示自己的相册
学习指导
zhidao
Htm 文件夹
分享自己的学习心得
软件下载
xiazai
Htm 文件夹
提供一个在线软件下载平台
联系我们
lianxi
Htm 文件夹
联系到我的方法
吴硕个人主页 V2.0
建站计划及安排
域名：wushuo123.cn
留言板
liuyan
Liuyan 文件夹
跟访者在线交流的平台
实训网站建设环境
实训时间：2013 年 6 月 8 日-6 月 14 日
实训内容：个人网站的建设
网站建设工具：dreamweaver cs5、记事本、IIS 信息服务、photoshop cs5
指导老师：周苏峡
准备工作
1.设计网站草图
2.使用 PS 画出设计图
3.使用 PS 分割图片
4.对图片进行加链接处理
5.后期细节处理
个人网站设计源码：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>吴硕个人主页(v2.0)|首页</title>
<meta name="keywords" content="吴硕，吴硕个人主页，吴硕个人博客，个人
主页，个人博客,v2.0" />
<meta name="description" content="吴硕个人主页，是专门为吴硕个人所建设的
个人展示平台，采用自主编程，一边学习，一边创作！" />
<link rel="shortcut icon" href="pic/favicon.ico">
<link rel="bookmark" href="pic/favicon.ico">
<link href="css/base.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/js.js"></script>
<script type="text/javascript" src="js/DD_belatedPNG.js"></script>
</head>
<body>
<!--头部公用部分-->
<div id="head">
<div id="tbnr">
<img src="pic/logo.png" class="pngFix">
<ul>
<li><a href="index.html">首页</a></li>
<li><a href="#">我的地盘</a>
<ul>
<li><a href="zone/jianli.html" class="aaa">我的简历</a></li>
<li><a href="zone/zuopin.html" class="aaa">我的作品</a></li>
<li><a href="zone/xiangce.html" class="aaa">我的相册</a></li>
</ul>
</li>
<li><a href="htm/xuexi.html">学习指导</a></li>
<li><a href="htm/ruanjian.html">软件下载</a></li>
<li><a href="htm/lianxi.html">联系我们</a></li>
<li><a href="liuyan/">留言板</a></li>
</ul>
<a href="old/index.html" target="_blank" title="点击此处查看旧版本"><img
src="pic/old.png" class="pngFix"></a>
</div>
</div>
<!--头部公共-->
<div id="neirong">
<div id="zhuti" class="pngFix">
<div id="wenzi">
<p align="left">在这个机遇和挑战并存的年代，作为一个有理想有抱负的年
轻一代。<br/>
没有人能够阻止我们向前。<br>
我们都有自己的梦想，我们都渴望成功，但是那种敢想敢做，敢做敢担的精神，
<br/>
却离我们越来越远。<br/>
世界每天都在飞速的变化，每天都有很多新的事物诞生也会有新的事物灭亡。
<br/>
我们只不过是偌大宇宙中的一粒沙子，想成功靠努力真的还不够。<br/>
你要有挑战新事物的勇气，敢想敢做！<br/>
<p align="left">敢想敢做在此刻给我的内涵便是努力学习，勇于开拓。</p>
<p align="right">2013 年 6 月 9 日 吴硕</p>
</div>
</div>
<!--我的作品代码开始-->
<a href="zone/zuopin.html" target="_blank" title=" 查 看 更 多 "><img
src="pic/wdzp.png" border="0" class="pngFix"></a>
<br/>
<ul class="box">
<li>
<a href="zone/zuopin.html" target="_blank">
<div class="toll_img"><img src="images/zp1.png" /></div>
<div class="toll_info"><p>名称：羽毛球比赛海报<br/>类别：photoshop 图像
处理<br/>时间：2013-04-28</p></div>
</a>
</li>
<li>
<a href="zone/zuopin.html" target="_blank">
<div class="toll_img"><img src="images/zp2.png" /></div>
<div class="toll_info"><p>名称：电子信息学院院徽设计<br/>类别：AI 标志
设计<br/>时间：2013-05-03</p></div>
</a>
</li>
<li>
<a href="zone/zuopin.html" target="_blank">
<div class="toll_img"><img src="images/zp3.png" /></div>
<div class="toll_info"><p>名称：《致青春》班级宣传片<br/>类别：会声会影 X6
视频处理<br/>时间：2013-05-20</p></div>
</a>
</li>
<li>
<a href="zone/zuopin.html" target="_blank">
<div class="toll_img"><img src="images/zp4.png" /></div>
<div class="toll_info"><p>名称：父亲 MTV<br/>类别：FLASH 动画制作<br/>
时间：2013-06-01</p></div>
</a>
</li>
</ul>
<!--我的作品代码结束-->
<div id="wzgx">
<img src="pic/wzgx.png">
<br/>
<ul>
<li><span>2013-06-09</span>全新的个人主页版式设计出炉，更细致的体验。
</li>
<li><span>2013-06-10</span>推出个人网站静态页面设计方案。</li>
<li><span>2013-06-11</span>实训开始，个人网站规划逐步落实。</li>
<li><span>2013-06-12</span>后台代码完成，准备上线！</li>
<li><span>2013-06-13</span>端午节持续奋战，有望在实训结束前完成网站。
</li>
</ul>
<ul>
<li><span>2013-06-09</span>全新的个人主页版式设计出炉，更细致的体验。
</li>
<li><span>2013-06-10</span>推出个人网站静态页面设计方案。</li>
<li><span>2013-06-11</span>实训开始，个人网站规划逐步落实。</li>
<li><span>2013-06-12</span>后台代码完成，准备上线！</li>
<li><span>2013-06-13</span>端午节持续奋战，有望在实训结束前完成网站。
</li>
</ul>
<br/>
</div>
</div>
<!--底部公用-->
<div id="footer">
<div id="ftnr">
<ul>
<li><a href="htm/link.html"><img src="pic/link1.png" width="50" height="15"
border="0" class="pngFix"></a></li>
<li><a href="http://www.lswd.pw" target="_blank" title=" 计网一班班级网站">
蓝色网盾</a></li>
<li><a href="http://www.tgc.edu.cn" target="_blank" title="湖北三峡职业技术学
院官网">湖北三峡职业技术学院</a></li>
<li><a href="http://www.tgc.edu.cn/xxgcx" target="_blank" title="湖北三峡职业
技术学院-电子信息学院">电子信息学院</a></li>
<li><a href="http://www.zhuzihui.cn" target="_blank" title=" 朱自会个人网站">
朱自会个人网站</a></li>
<li><a href="http://www.zouzijian.cn" target="_blank" title="邹子健个人网站">
邹子健个人网站</a></li>
<li><a href="http://www.lilei520.cn" target="_blank" title=" 黎 磊 个 人 网 站
"></a></li>
<li><a href="http://www.iceart.me/" target="_blank" title=" 优秀网站建设团队">
冰艺</a></li>
<li><a href="http://www.5kun.com" target="_blank" title=" 金鹰网前端设计师
">5KUN</a></li>
<li><a href="http://www.zcool.cn" target="_blank" title=" 设计师的家"> 站酷
</a></li>
<li><a href="http://ecd.tencent.com/" target="_blank" title="腾讯 ecd--电商用户
体验设计部 E-Commerce User Experience">腾讯 ECD</a></li>
<li><a href="http://http://www.blueidea.com/" target="_blank" title=" 艺术设计
窗口">蓝色理想</a></li>
<li><a href="http://www.52design.com/" target="_blank" title="开启你的设计创
意">创意在线</a></li>
</ul>
<br/>
<img src="pic/bq.png" class="pngFix" id="bq">
</div>
</div>
<!--IE6 检测-->
<!--[if lte IE 6]>
<div id="ie6-warning">
<p>本网站采用 HTML+CSS3 进行布局，您正在使用 IE6.o 低版本浏览
器 ， 显 示 效 果 可 能 有 差 异 ， 影 响 您 正 常 访 问 。 建 议 您 升 级 到 <a
href="http://www.microsoft.com/china/windows/internet-explorer/"
target="_blank">IE8.0</a> /<a
href="http://www.mozillaonline.com/">Firefox</a> / <a
href="http://www.google.com/chrome/?hl=zh-CN">Chrome</a> / <a
href="http://www.apple.com.cn/safari/">Safari</a> / <a
href="http://www.operachina.com/">Opera</a></p>
</div>
<script type="text/javascript">
jQuery(function ($) {
if ( jQuery.browser.msie && ( jQuery.browser.version == "6.0" )
&& !jQuery.support.style ){
jQuery('#ie6-warning').css({'top':jQuery(this).scrollTop()+'px'});
}
});
</script>
<![endif]-->
<!--网站公用部分开始-->
<!--百度分享浮动窗口代码开始-->
<script type="text/javascript" id="bdshare_js"
data="type=slide&img=6&mini=1&pos=right&uid=638998" ><
/script>
<script type="text/javascript" id="bdshell_js"></script>
<script type="text/javascript">
var bds_config={"bdTop":199};
document.getElementById("bdshell_js").src =
"http://bdimg.share.baidu.com/static/js/shell_v2.js?cdnversion=" + Math.ceil(new
Date()/3600000);
</script>
<!--百度分享浮动窗口代码结束-->
</body>
</html>
