《网页设计与制作》实验报告（一）.docVIP

实验一 Dreamweaver创建网站 一、实验环境：电脑、Windows环境、Dreamweaver软件。 二、实验目的及要求：要求学生熟练掌握掌握Dreamweaver设置建立站点；重点在主页?(子页)的文本编辑与超链接。初步学会使用“网页三剑客”。 三、实验内容：制作一个简单的商务网站（例如D:\myweb站点），要求有一个主页（D:\myweb\index主页）；子页至少三个（D:\myweb\ page1、page2、page3子页）,并使主页与子页进行相互“超链接”，在网页页面内，插入表格，输入文字与图片，美化页面使之艺术化等。 四、实验步骤： 1、首先双击桌面Dreamweaver图标，打开进入网页制作界面，即新建站点：单击“站点”莱单→管理站点→高级→选择“新建站点”，输入站点位置名称（例如：站点为MYWEB，保存位置为D:\MYWEB）→确定。 2、然后单击“文件”莱单→新建→新建普通空白网页，在编辑界面中，先单击“属性”面板中的“居中对齐”，再单击插入栏中的“插入表格”→选择插入6行×6列、边框粗细为0的表格→确定。并可选中表格→在“属性”面板中为其填充颜色等。此外，输入若干文字（主要内容为：站点名称、站点正文内容简介、导航栏内容、版权介绍等）→并将文档内容选中→在“属性”面板中为其设置字体、大小、颜色、对齐方式等。另可在插入栏内，选择插入图片（静态或动态图片），还可插入flash动画电影。在“插入”菜单中→选择媒体→插件→选择某背景音乐等。在“修改”菜单中→页面属性→选择设定背景颜色或背景图片。美化版面，赋予整个页面的艺术性。最后将其保存为主页（D:\MYWEB\index）。 3、再次单击“文件”莱单，新建一个新的网页，重复第二步操作，并分别排版此网页编辑界面中的文档，插入表格，输入文字，插入图片，设定背景，另可设置层和框架与表单、CSS样式及模板等。并保存为子页（例如：D:\MYWEB\ PAGE1子页）。其它子页（例如PAGE2与PAGE3子页）制作方法与之类似。 4、在站点的主（子）页已创建完毕的基础上，打开主页，“选中某一行文字或图片（例如：选中主页中的PAGE1）→选择工具拦上的 “超链接” →设定指向的目标子页（例如：D:\MYWEB\ PAGE1）→确定。用类似的方法设置主页与各个子页之间的“超链接”，实现相互跳转页面的功能。另外，也可设置电子邮件链接、空链接与友情链接等。 5、在所有网页保存完毕后，在界面中直接接“F12”键直接运行浏览网页的创建效果。 五、实验结果 六、总结 实验二 网页特效制作 一、实验环境：电脑、Windows环境、Dreamweaver软件。 二、实验目的及要求：要求学生掌握在网页之中制作特效，并应用提示信息、滚盖图、图像映射、背景音乐、飘动的广告等实例。了解源文件代码制作特效应用实例。 三、实验内容：在主页index内，制作图像提示信息；PAGE1子页中制作“自然风光滚盖图”；在PAGE2子页中制作“图像热区映射”，在PAGE3子页的html源文件代码中插入“特效代码”，使网页内出现特效（例如：制作滚动文字及飘动广告等）。 四、实验步骤： 1、制作提示信息方法为：在编辑区内插入某图片→选中该图片→在属性面板内的“替代”文本框内，输入所需信息→单击“文件”莱单→保存即可。 2、制作滚盖图的方法为：首先选择编辑区内插入点→在插入工具栏上，单击“图像” →鼠标经过图像→在“原始图像”中选择某图片→在“鼠标经过图像”中选择某图片→确定即可→单击“文件”菜单→保存。 3、制作“热区映射”的方法为：选中编辑区内的某图像→在“属性”面板中选中热区工具（例如：矩形、圆形、多边形工具）→在此图中开拉，选中热区→在“热区”单击右键→选择“创建链接”→使“热区”超链接指向某一目标（例如某网页）→确定→单击“文件”菜单→保存。 4、在网上查找具有“特效代码”的网站（例如：无忧网），选择“特效代码”选项，进入此网页中，查询各类html源文件代码，将某一特效代码“拉黑”选中，右键单击复制，进入Dreamweaver页面中的代码界面内，在body与body之间之间粘贴，选择保存后，按F12键查看“特效”结果（例如：滚动文字及飘动广告等）。 五、实验结果 六、总结 实验三 Dreamweaver上传发布站点 一、实验环境：电脑、Windows环境、Dreamweaver软件。 二、实验目的及要求：要求学生掌握Dreamweaver保存完整的Web站点、申请网页空间与注册域名、上传本地站点。 三、实验内容：将已经制作完成的MYWEB站点，上传到网上服务器发布等。 四、实验步骤： 1、打包上传到局域网的过程： 首先打开MYWEB站点文件，检查测试是否无误，是否有“超链接”错误等，如果出现则修