网页设计实验指导.doc

《网页设计与制作实验指导书》

河南科技大学管理学院
目录
TOC\o"1-3"\h\z\uHYPERLINK\l"_Toc318758303"实验规则 PAGEREF_Toc318758303\h3
HYPERLINK\l"_Toc318758304"实验报告要求 PAGEREF_Toc318758304\h4
HYPERLINK\l"_Toc318758305"基本实验方法 PAGEREF_Toc318758305\h4
HYPERLINK\l"_Toc318758306"实验环境 PAGEREF_Toc318758306\h4
HYPERLINK\l"_Toc318758307"实验一Dreamweaver8基本操作、站点管理 PAGEREF_Toc318758307\h5
HYPERLINK\l"_Toc318758308"实验二网页的定位技术以及制作层动画 PAGEREF_Toc318758308\h7
HYPERLINK\l"_Toc318758309"实验三网页编辑与超链接 PAGEREF_Toc318758309\h13
HYPERLINK\l"_Toc318758310"实验四层叠样式、模板和库 PAGEREF_Toc318758310\h17
HYPERLINK\l"_Toc318758311"实验五表单与表单域 PAGEREF_Toc318758311\h23


实验规则
为了顺利完成实验教学任务，确保人身设备安全，培养严谨、踏实、实事求是的科学作风和爱护国家财产的优良品质，特制定以下实验规则：
1、实验纪律
（1）在实验室不得做和实验无关的事情。
（2）遵守纪律，不迟到，不旷课。
（3）不能拆卸硬件，更不能拿走实验设备或仪器。
（4）保持实验室安静、整洁，爱护公物。
2、实验过程
（1）预习实验内容。
（2）上机操作。记录实验中遇到的问题，主要是错误信息和错误原因。
（3）检查操作结果是否正确。
（4）根据实验过程的记录书写实验报告。

实验报告要求
1、报告用纸采用统一的河南科技大学实验报告用纸，或按照指导老师指定的统一格式打印。
2、实验报告封面内容
实验名称：（如实验一网页的定位技术）
班级名称：（如计031班）
学生学号：
学生姓名：
实验时间：
3、实验报告内容
见各具体实验项目的要求。
基本实验方法
本实验要求熟悉Dreamweaver8.0的工作环境和网页设计制作的相关知识。

实验环境
Dreamweaver8.0

实验一Dreamweaver8基本操作、站点管理
一、实验目的和要求：
掌握Dreamweaver8启动和退出的方法。
掌握本站点的设置方法。
掌握创建、打开和保存HTML文档的方法
二、实验内容：
网页编辑器的基本操作
用不同的方法启动和退出Dreamweaver8。
用快捷键打开和关闭【插入】面板和【属性】面板。
将【代码】浮动面板组打开后，先移出，再移入浮动面板放置区，然后再将【设计】浮动面板组中的【CSS样式】组合到【代码】浮动面板组中。察看浮动面板组操作后的效果。
用快捷键关闭和打开浮动面板组，用鼠标折叠和展开各个浮动面板组，察看浮动面板组操作后的效果。
建立网站的基本操作
打开站点管理器，在本地计算机的当前盘根文件夹中，建立名为myweb的文件夹。
把文件夹myweb设置为本地站点的根文件夹。然后建立名为image文件夹。
在本地计算机的当前盘根文件夹中，建立名为oursite的子文件夹，并切换为本地站点的根文件夹。
文件管理基本操作
将ch12\material文件夹中的两个文件bg0004.gif和bg0093.gif及myrose中的文件rose.htm，分别复制到本地站点“我们的站点”的oursite文件夹中。
在文件夹中oursite中新建子文件夹image，并将oursite中的文件bg0004.gif和bg0093.gif转移到image文件夹中。
请正确显示rose.htm网页。
制作简单网页
按下述要求制作网页exe12-1.htm，如图12-2所示。
页面的背景图片为ch12\material文件夹中的图片bg0015.jpg。
在合适的位置上插入ch12\material文件夹中的图片文件ex1.jpg。
在网页中输入文字：一件好的作品，如一阵清新的风，一曲温婉的歌，让人心旷神怡。一件好的作品，如一杯香醇的茶，一瓶陈年的酒，让人回味无穷...
将网页用exe12-1.htm为名保存在本地站点的文件夹oursite中。

图12-2