个人网站设计与制作课程设计
相关主题
- 1、下载文档前请自行甄别文档内容的完整性，平台不提供额外的编辑、内容补充、找答案等附加服务。
- 2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
- 3、如文档侵犯您的权益，请联系客服反馈,我们会尽快为您处理(人工客服工作时间：9:00-18:30)。
<marquee behavior="scroll" direction="left" scrollamount="3" loop="-1"
scrolldelay="300" height="50" onmouseout="start()" onmouseover="stop()">
<p> <span class="STYLE1"> <span class="STYLE3" onfocus="MM_controlSound('play','document.CS96','Music/胡彦斌-闪亮的日子.mp3')"> <img src="pic/mus/hu.jpg" name="Image37" width="25" height="25" border="0" id="Image37" />胡彦斌——闪亮的日子</span></span></p>
课 程 名：静态网页
实验课题：个人网站设计与制作
实验要求：静态网页，至少包含主页，日志， 相册，留言板，个人资料
制作准备：确定网站主题风格，网站结构，颜色搭配，搜集素材。
制作环境：Adobe Dreamweaver CS4
指导老师：金秋乐老师
主页页面
1、马鞍山即使天气预报代码
<iframe src=" " width="245" height="110" marginwidth="0" marginheight="0" hspace="0" vspace="0" frameborder="0" scrolling="No" allowTransparency="true"（允许透明=“真”）></iframe>
font-size: 100%;
cursor: default; //是默认的小箭头指向
width: 8em; //控制菜单栏之间的宽度
}
ul.MenuBarVertical ul
{
……
width: 6.2em; //控制二级菜单的可视宽度，但不是二级菜单的实际宽度（不太好描述，结合下一注释和实际操作更好理解^_^）
</map>
5、相册before love用到鼠标经过图像
音乐页面
1、歌词的显示和歌曲的滚动都用到了Marquee语句，本页面还利用行为播放声音代码如下div align="center"><span class="粗1">正在播放</span><span class="Blue1" onfocus="MM_controlSound('play','document.CS40','Download/胡彦斌-闪亮的日子.mp3')">
1、相册的建立用到了Fireworks CS4很方便的建立了整个相册
2、相册封面借助PS统一了风格
3、每个相片的页面也都能进入其他页面，例如下一页，前一页，留言板，音乐
4、相册Dear Family用到了行为
<map name="Map6" id="Map6">
<area shape="rect" coords="53,31,154,108" href="#" onclick="MM_popupMsg('对不起，您暂时没有访问权，')" />
……
}
ul.MenuBarVertical ul li
{
width: 6.4em; //这个才是控制二级菜单的宽度，如果这个width设置为8em,上一个width还是6.2em，这个二级菜单的实际宽度为8em，但可以看到宽6.4em的界面，剩下1.6em的透明界面，但是二级菜单的右边框还是显示在另一菜单上。
</span><span class="df">位来访客</span><span class="STYLE16"><span class="df">。</span></span>
</center
3、时间代码用到了JavaScript脚本语言
4、前期图片美化、裁剪多次用到photoshopCS4
5、多次用到Map链接
日志页面百度文库
1、日志页面用到Spry选项卡式面板参数为默认
2、“日志名”居左，“推荐”居右
3、每篇日志中的每个“上一篇”和“下一篇”和“返回日志列表”都是真实有效的，规格参数都一样
1、在日志里加入了媒体元素，*.swf游戏和*.flv视频媒体元素的Html链接目标均设置为_blank，方便返回主页面。
相册页面
2、访客记录代码
<div id="apDiv2"></div>
<p><td width="383" rowspan="2"><center>
<span class="df">您是第</span><span class="STYLE16">
<script src="" language="JavaScript" charset="gb2312"></script>
制作总结：
1、在做网站前要养成建站点在站点里操作的习惯。
2、在制作网站的过程中大量用到表格，掌握了表格的嵌套，拆分，添加，删除……。
3、在制作网站的过程中运用到CSS样式，了解到其强大的功能，听说DIV+CSS样式功能更强大，可惜DIV控制不太熟悉，能做出自己本来不会的东西才算是学会了东西。
}
随笔页面
随笔页面利用表格和图片做出种笔记本的感觉，只是在表格里设置背景图像repeat---y出现点小问题。
分享页面
1、Spry选项卡式面板
2、电子书籍下载用到下载链接
3、游戏分享插入了*swf格式小游戏Html目标设置为_blank方便返回主页面
好友页面
之前没有设置这个页面，是想放一些外链的，做了好久发现不是很美观就换做这个好友秀页面了……
</marquee>
</span></div>（详见日志：滚动文字Marquee属性及参数设置）
2、多次用到Spry菜单栏来显示歌曲
ul.MenuBarVertical
{
margin: 0; //控制菜单栏与上下表格的距离
padding: 0; //控制内边距，相对于margin外边距
list-style-type: none;
本来是想把同学做的网站连在一起，那样好像也算是一个班级的网站，可惜没连上……
留言板页面
1、鼠标经过图像
2、Marquee语句控制的向上滚动的寄语
3、用到表单，文本域，按钮，单选框
4、这只是个留言板的静态模拟，期待能做出动态的留言板。
资料页面
简单的表格布局，一直在思考漂亮点的模式，可是一直没想到只好用这个简单的模式了
scrolldelay="300" height="50" onmouseout="start()" onmouseover="stop()">
<p> <span class="STYLE1"> <span class="STYLE3" onfocus="MM_controlSound('play','document.CS96','Music/胡彦斌-闪亮的日子.mp3')"> <img src="pic/mus/hu.jpg" name="Image37" width="25" height="25" border="0" id="Image37" />胡彦斌——闪亮的日子</span></span></p>
课 程 名：静态网页
实验课题：个人网站设计与制作
实验要求：静态网页，至少包含主页，日志， 相册，留言板，个人资料
制作准备：确定网站主题风格，网站结构，颜色搭配，搜集素材。
制作环境：Adobe Dreamweaver CS4
指导老师：金秋乐老师
主页页面
1、马鞍山即使天气预报代码
<iframe src=" " width="245" height="110" marginwidth="0" marginheight="0" hspace="0" vspace="0" frameborder="0" scrolling="No" allowTransparency="true"（允许透明=“真”）></iframe>
font-size: 100%;
cursor: default; //是默认的小箭头指向
width: 8em; //控制菜单栏之间的宽度
}
ul.MenuBarVertical ul
{
……
width: 6.2em; //控制二级菜单的可视宽度，但不是二级菜单的实际宽度（不太好描述，结合下一注释和实际操作更好理解^_^）
</map>
5、相册before love用到鼠标经过图像
音乐页面
1、歌词的显示和歌曲的滚动都用到了Marquee语句，本页面还利用行为播放声音代码如下div align="center"><span class="粗1">正在播放</span><span class="Blue1" onfocus="MM_controlSound('play','document.CS40','Download/胡彦斌-闪亮的日子.mp3')">
1、相册的建立用到了Fireworks CS4很方便的建立了整个相册
2、相册封面借助PS统一了风格
3、每个相片的页面也都能进入其他页面，例如下一页，前一页，留言板，音乐
4、相册Dear Family用到了行为
<map name="Map6" id="Map6">
<area shape="rect" coords="53,31,154,108" href="#" onclick="MM_popupMsg('对不起，您暂时没有访问权，')" />
……
}
ul.MenuBarVertical ul li
{
width: 6.4em; //这个才是控制二级菜单的宽度，如果这个width设置为8em,上一个width还是6.2em，这个二级菜单的实际宽度为8em，但可以看到宽6.4em的界面，剩下1.6em的透明界面，但是二级菜单的右边框还是显示在另一菜单上。
</span><span class="df">位来访客</span><span class="STYLE16"><span class="df">。</span></span>
</center
3、时间代码用到了JavaScript脚本语言
4、前期图片美化、裁剪多次用到photoshopCS4
5、多次用到Map链接
日志页面百度文库
1、日志页面用到Spry选项卡式面板参数为默认
2、“日志名”居左，“推荐”居右
3、每篇日志中的每个“上一篇”和“下一篇”和“返回日志列表”都是真实有效的，规格参数都一样
1、在日志里加入了媒体元素，*.swf游戏和*.flv视频媒体元素的Html链接目标均设置为_blank，方便返回主页面。
相册页面
2、访客记录代码
<div id="apDiv2"></div>
<p><td width="383" rowspan="2"><center>
<span class="df">您是第</span><span class="STYLE16">
<script src="" language="JavaScript" charset="gb2312"></script>
制作总结：
1、在做网站前要养成建站点在站点里操作的习惯。
2、在制作网站的过程中大量用到表格，掌握了表格的嵌套，拆分，添加，删除……。
3、在制作网站的过程中运用到CSS样式，了解到其强大的功能，听说DIV+CSS样式功能更强大，可惜DIV控制不太熟悉，能做出自己本来不会的东西才算是学会了东西。
}
随笔页面
随笔页面利用表格和图片做出种笔记本的感觉，只是在表格里设置背景图像repeat---y出现点小问题。
分享页面
1、Spry选项卡式面板
2、电子书籍下载用到下载链接
3、游戏分享插入了*swf格式小游戏Html目标设置为_blank方便返回主页面
好友页面
之前没有设置这个页面，是想放一些外链的，做了好久发现不是很美观就换做这个好友秀页面了……
</marquee>
</span></div>（详见日志：滚动文字Marquee属性及参数设置）
2、多次用到Spry菜单栏来显示歌曲
ul.MenuBarVertical
{
margin: 0; //控制菜单栏与上下表格的距离
padding: 0; //控制内边距，相对于margin外边距
list-style-type: none;
本来是想把同学做的网站连在一起，那样好像也算是一个班级的网站，可惜没连上……
留言板页面
1、鼠标经过图像
2、Marquee语句控制的向上滚动的寄语
3、用到表单，文本域，按钮，单选框
4、这只是个留言板的静态模拟，期待能做出动态的留言板。
资料页面
简单的表格布局，一直在思考漂亮点的模式，可是一直没想到只好用这个简单的模式了