大学计算机应用基础实验教程(第三版) 詹国华主编
- 1、下载文档前请自行甄别文档内容的完整性，平台不提供额外的编辑、内容补充、找答案等附加服务。
- 2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
- 3、如文档侵犯您的权益，请联系客服反馈,我们会尽快为您处理(人工客服工作时间：9:00-18:30)。
第五章网页制作
参考资料：大学计算机应用基础实验教程(第三版) 詹国华主编，p192~220.
本实验从新建站点结构开始，通过Dreamweaver制作首页和寝室成员介绍页“关于我们”（about.html），通过两个页面的制作了解网页的制作组成要素和制作网页的基本步骤
本实验使用的软件为Dreamweaver和开源软件包AppServ。
5.1 基本网页制作
参考资料：大学计算机应用基础实验教程(第三版) 詹国华主编，p192~199. 5.1.1 网站及网页的创建
根据第四章所示的站点结构，新建站点，并且保存在指定的路径下（。由于后期涉及到动态网页的创建，因此，我们将目录存放在AppServ安装目录下的WWW文件夹内。新建站点后，新建站点内的网页和文件夹，结构和文件名可参考下图
新建动态站点操作步骤：
（1）启动Dreamweaver，出现如下图所示的界面
（2）单击新建浮动面板的Dreamweaver站点，或菜单站点——新建站点。（3）出现站点设置对象对话框，如左下图，在站点选项卡中，输入站点名称，例如“Dorm”，输入本地站点文件夹，如“D：\AppServ\WWW\Dorm\”。注意，站点文件夹，一定要放在AppServ安装目录下的WWW文件夹内。这是因为有一个网页是属于动态网页。
（4）然后点击服务器选项卡，出现右上图所示对话框，点击对话框右侧左下方的“+”，并进行设置。如下图所示。
（5）点击“保存”之后，出现如下图所示
（6）保存，动态站点设置完毕。
新建文件夹和文件
（1）在新建的站点中，按照图4.1所示的站点结构新建文件夹和对应的文件，新建完成后，如下图所示。
（2）将提供的素材照片都复制粘贴到“Image”文件夹下，并在“文件”面板上单击“刷新按钮”，借口查看到新导入的图片资源文件。
5.1.2 首页内容的制作
参考资料：大学计算机应用基础实验教程(第三版) 詹国华主编，p194~197. 5.1.3“关于我们”页内容的制作
参考资料：大学计算机应用基础实验教程(第三版) 詹国华主编，p197~199. 5.2 网页布局
参考资料：大学计算机应用基础实验教程(第三版) 詹国华主编，p200~213.
5.2.1 DIV+CSS布局首页
参考资料：大学计算机应用基础实验教程(第三版) 詹国华主编，p200~208.
5.2.2 DIV+CSS布局“关于我们”
参考资料：大学计算机应用基础实验教程(第三版) 詹国华主编，p200~208.
参考资料：大学计算机应用基础实验教程(第三版) 詹国华主编，p208~210.
5.2.3 框架布局
参考资料：大学计算机应用基础实验教程(第三版) 詹国华主编，p210~213.
5.3 表单设计
参考资料：大学计算机应用基础实验教程(第三版) 詹国华主编，p216~220。