《网页设计第3次实验库、模板、表单的使用2》由会员分享，可在线阅读，更多相关《网页设计第3次实验库、模板、表单的使用2（5页珍藏版）》请在金锄头文库上搜索。
1、实 验 报 告（计算机类）课程名称： 网页设计实验项目： 库、模板、表单的使用计算机号：院系专业：班级学号：学生姓名：实验日期：信息管理学院实践教学中心制一、 实验目的：1. 掌握创建和应用库项目的方法；2. 掌握创建和应用模板的方法。3. 掌握插入和设置表单对象的方法；4. 掌握插入和设置 Spry 验证表单对象的方法。二、 实验内容：1. 创建和应用库项目；2. 创建和应用模板。3. 插入和设置表单对象；4. 插入和设置 Spry 验证表单对象。三、 实验环境（使用硬件、软件等）：1. 计算机(CPU PIII 以上 ，内存 128M 以上，硬盘 20G 以上 )2. WindowsXP
2、操作系统3. IIS5.14. ACCESS 或 SQL 数据库5. Dreamweaver CS5备注：序号（一） 、 （二） 、 （三）为实验预习填写项四、 实验步骤及程序编辑：1. 启动 Dreamweaver MX 2004 程序，选择菜单“文件”“新建”命令，打开“新建文档”对话框.在对话框“常规”标签下选择“类型”列表中的“基本页”选项，创建 HTML 网页.2. 创建页面后，按 Ctrl+s 键，保存网页到本地站点内，文件命名为 form.htm.如图 12-1 所示.3. 保存页面后,选择插入面板上的表单选项,在表单面板中单击 表单按钮 000,在页面中插入表单 域4. 将光标
3、停放到表单域中,选择常用面板上的表格 按钮 ,在表单域中插入 8 行 2 列的表格.5. 用鼠标选中表格,打开属性面板.6. 在表格属性中,设置其宽度为 500 像素, 填充值为 1,间距值为 0,在对齐 下拉列表中选择绝对居中 选项 ,边框 值为 1,最后在 边框颜色文本框中输入色标值#FFFFFF(白色).7. 拖动鼠标 ,选中表格第一行的两个单元格 ,在属性面板的 背景颜色文本框中输入色标值#6699CC,或单击旁边的背景颜色 按钮 ,选取蓝色.8. 拖动鼠标,选中其他单元格,设置背景颜色为灰色(色标值为#CCCCCC).9. 完成表格的属性设置后,按下键盘 Ctrl+s 键或选择 文件
4、保存 命令,保存页面.10. 在第 1 行单元格内输入文字用户信息,然后选中文字打开属性面板 ,单击面板的 绝对居中按钮,使文字移动到表格的中间位置.设置文本颜色为白色(色标值#FFFFFF).如图 12-3 所示.11. 在第 2 行第 1 个单元格中输入文字用户名:,然后单击表单面板中 文本字段按钮,插入文本框.12. 选中插入的文本框,打开属性面板 ,在 文本域下面的文本框中输入name,这是文本框的名称;在字符宽度文本框中输入 25;类型 选择单行单选按钮; 最多字符数和初始值 为默认.参数设置如图12-4 所示 .13. 在第 2 行第 2 个表格中输入文字密码:,按同样的方法插入文
5、本框.然后选中文本框打开属性面板,在 文本域中输入名称为 Passowrd,字符宽度为 25,类型 选择密码单选按钮, 最多字符数和初始值不用填.如图 12-5 所示.14. 在第 3 行第 1 个表格中分别输入“性别：”“男”“女”，然后单击表单面板中的“单选按钮”按钮*，在“男”“女”的前面分别插入单选按钮。15. 选中第一个单选取按钮，打开属性面板，在“单选按钮”文本框中输入单选按钮名称man，“选定值 ”文本框中输入“男”，“初始状态”选择“未选中”单选按钮，如图 12-6 所示。接着选中第 2 个单选按钮，其设置名称和选定值分别是 woman.女，其他设置一样。16. 在第 3 行第
6、 2 个表格中输入“省份：”，然后单击表单面板中的 “列表/ 菜单”按钮 ，在“省份：”旁边插入“列表/菜单”框。17. 选中“列表/菜单”框，单击属性能面板上的 按钮，打开“列表值”对话框，在“项目标签”下面输入各个省份的名称，如北京.黑龙江等，单击 按钮可增加项目，单击 按钮可删除项目，右边的 两个按钮，可用来调整项目的上下位置。如图 12-8 所示。18. 单击“确定”按钮，返回属性面板，在“初始化时选取定”文本框中出现了刚才设置的项目标签。然后在“列表/菜单”下面的文本框中输入 “select”，在“类型”选项区选择“菜单”单选按钮。如图 12-9 所示。19. 在第 4 行的两个表格
7、中分别插入“电话“和“地址”的“文本字段”。其属性的名称分别是Phone 和 Address，“字符宽度”都是 25，“类型”都选择“单行”。20. 在第 5 行的第 1 个表格中输入“E-mail：”文字，插入“文本字段”，属性面板中的“文本域”名称为 Email， “字符宽度” 为 25，“类型”选择“单行 ”，其他设置为默认就可以。21. 在第 5 行的第 2 个表格中输入“上传：”文字，然后单击表单面板中的“文件域”按钮，在“上传：”文字旁边插入文字域字段，接着在属性面板中的“文件域名称”中输入 file，“字符宽度”文本框中输入 16，“最多字符”的文本框保留为空。参数设置如图 12
8、-10 所示。22. 拖动鼠标选中第 6 行两个表格，单 属性面板上的“合并” 按钮，合并两个表格，然后在表格中输入文字“爱好：”，空两格后分别输入读书.上网.旅游.游戏等文字，接着单击表单面板上的“复选框”按钮 ，分别在各选取项前面插入复选取框。23. 打开属性面板，分别选取中页面中的复选取框，在“复选取框名称”文本框中分别输入Study.web.Travel.Game。在“ 选取定值”文本框中也依次输入“读书”“上网”“旅游”“游戏”。“初始状态”都选择“未选中”。24. 拖动鼠标选中第 2 行到第 5 行的单元格，然后打开属性面板，单击“左对齐”按钮 ，使表格中的内容都靠左对齐。如图 1
9、2-11 所示。25. 合并第 7 行两个单元格，输入 “个人介绍”文字，按住键盘 Shift 键回车，另起一行，然后单击表单面板上的“文本区域”按钮 ，插入文本域。26. 选中文本域，打开属性面板，在“文本域 ”下输入名称 content，在“字符宽度”文本框中输入 40，在“行数”中输入 5，在“类型”选项中选择“多行”单选取按钮。参数设置如图 12-12 所示。27. 在最后一行中，连续两次单击插入面板上的“表单”“按钮”按钮 。在表格中插入两个按钮，其中一个是“发送”按钮，一个是“重填”按钮。28. 选中第一个按钮，打开属性面板，在“标签”文本框中输入“发送”，在“动作”选项中选择“提交表单”单选按钮，参数设置如图 12-13 所示。接着选择第二个按钮，在属性面板中的“标签”文本框中输入“重填写”，“动作”选择“重设表单”选项。29. 插入表单中各个需要的元素之后，整个表单页面的结构就制作完成了，按下 F12 键即可浏览网页。如图 12-14 所示。五、 程序调试及实验总结：六、成 绩七、 教师评语：1.实验中善于联系理论，做到了通过实验掌握理论的相关知识。2.积极认真的独立完成实验老师布置的实验任务，并能解决实验中出现的程序问题。3.该学生上课积极,态度端正,及时完成布置的实验项目,善于沟通交流,完成质量较高.主讲教师：
