网页制作课件

以下为《网页制作课件》的无排版文字预览，完整格式请下载

下载前请仔细阅读文字预览以及下方图片预览。图片预览是什么样的，下载的文档就是什么样的。

Dreamweaver网页制作第六单元 制作“访客信息”网页 燕某某　　任务描述：前面学习了网页制作的相关知识，已经知道，浏览者作为网站的用户，可以从网站了解相关信息，但是网站管理员如何通过网页获得浏览者的信息呢？在这个单元当中，将介绍使用表单来获得信息的基本方法，制作一个用于和用户进行交互的“访客信息”网页，效果如下图所示。 第六单元 制作“访客信息”网页 第六单元 制作“访客信息”网页 任务一 插入表单任务二 检查表单 第六单元 制作“访客信息”网页任务一 插入表单 任务描述：在页面中插入表单及表单元素制作“访客信息”页面。 任务分析：表单是网站与用户之间沟通的桥梁，其应用非常广泛，如制作访客信息、论坛、留言板、用户注册和在线交易等类型的网页。有了表单，网站不仅是信息提供者，同时也是信息获取者。因此，应用表单可以与Web站点的访问者进行交互。本任务通过向网页插入一个表单，然后使用表格对“访客信息”的各个表单元素进行布局，制作一个“访客信息”页面，学习表单页面制作的基本方法。任务一 插入表单 自己动手：

1．建立本栏目目录结构 。

本栏目目录结构如下表所示：任务一 插入表单 2．创建表单。

打开“bbs.html”页面，修改页面标题并设置“页面属性”。将“插入”栏切换到“表单”类别。任务一 插入表单 表单 插入的表单在文档窗口中以红色虚线表示。

任务一 插入表单 在表单的虚线框中单击，插入一个11行2列的表格，设置表格属性,在第一列单元格中填写内容，此时页面如下图所示 : 3．设置表单属性 选中表单后，在表单“属性”面板设置动作为sed.html，其他保持默认值。任务一 插入表单 “表单”属性面板选项介绍 选择表单的方法：单击表单轮廓线，或从文档窗口左下角的标签选择器中选择“”标签 。任务一 插入表单 4．插入表单元素 切换“插入”栏到“表单”类别，工具栏中按钮如下图所示： 各按钮功能简介 任务一 插入表单 A. 插入“留言标题”文本字段 。

选中“留言标题”文本字段，在“属性”面板中设置文本字段名

称为“title”，“初始值”文本框中输入“请在这里输入留言标题！”。 B. 插入“留言人姓名”文本字段 ” 。 C. 插入单选按钮 。在“属性”面板中，分别设置三个单选按钮

的属性 。下图所示为“帅哥”单选按钮属性设置。 D. 插入“列表/菜单” 。任务一 插入表单 E. 插入 “单选按钮组” 。 任务一 插入表单 F. 插入 “自定义头像”文件域 。 插入文件域后，页面及文件域属性如下图所示。 任务一 插入表单 G. 插入 “电子邮件”文本字段 。 H. 插入“个人网站”文本字段 。 I. 插入复选框 。 单击“插入”栏“表单”类别中的“复选框”按钮，弹出“输入标签辅助功能属性”对话框，在“标签文字”文本框中输入“看书”。 任务一 插入表单 在“属性”面板中，设置复选框的属性，如下图所示 。 按照同样的方法再添加5个复选框，并依次输入“体育”、

“购物”、“上网”、“电影”和“其他”等不同的标签文字，把各复

选框的“选定值”设为不同的值，生成一组名称均为“checkbox1”

复选框，如下图所示。任务一 插入表单 任务一 插入表单 J. 插入文本域并设置属性 。 K. 插入按钮 。 任务总结： 任务一 插入表单 1．插入表单及表单属性的设置。

2．插入表单元素及表单元素属性的设置。

3．表单的作用。

4．通常“访客信息”只是网页中的一小部分，表单一般都是插入到布局表格的一个单元格内，而不是将整个页面的布局表格都插入到表单中。

一个表单页面制作完成后，还需要后台处理程序的协助才能完成信息的互动任务。表单有两个重要组成部分，一是描述表单的HTML源代码，二是用于处理用户在表单域中输入信息的服务器端应用程序，如“ASP”、“CGI”等。本单元仅介绍前一部分，即如何利用表单及相关标记生成用户界面。 举一反三： 任务一 插入表单 1．分析如图所示的“会员资料登记”页面中有哪些表单元素。　　A.启发思路：

　　常用的表单元素有：文本框、密码框、单选按钮、复选框、按钮等。 　　B.分组完成任务。 2． 将本单元“举一反三”文件夹中的网页“practice6-1.html”拷贝到D盘根目录，将表单中的“单选按钮组”修改为“列表/菜单”元素，“列表/菜单”元素修改为“单选按钮组”，并使其具有相同的功能。　　A.启发思路：

　　多个单选按钮在同一页面中成组使用时，这些单选按钮必须使用相同的名称，以确保只能选中其中的一个。用户可以从列表中选择多项内容，但只能从菜单中选择一项。　　B.分组完成任务。任务一 插入表单 　　作业：

　　1．利用本单元所学的知识，制作个人网站的“个人简介”网页“practice6-2.html”，效果如下图所示。 要点提示：首先插入表单，然后在表单中插入8行2列的表格，并设置表格属性，之后插入表单元素。 任务一 插入表单 任务二 检查表单 任务描述：检验“访客信息”栏目中表单输入数据的正确性。 任务分析：用户在表单中输入内容时，可能会输入各种各样的数据，其中有些可能是无效的，为了避免这些无效的数据提交到后 内容过长，仅展示头部和尾部部分文字预览，全文请查看图片预览。 表单 　　 相关知识： “数字”单选按钮：检查该域是否只包含数字，即文本域中只能接收数字形式的数据

“电子邮件地址”单选按钮：检查域中输入的内容是否符合电子邮件格式。

“数字从…到…”单选按钮：检查域是否包含指定范围内的数字，即文本域只能接受一定范围内的数字。任务二 检查表单 “任何东西”：如果该域是必需的但不需要包含任何特定类型的数据，则单击“任何东西”按钮。如果没有选中“必需的”复选框，则“任何东西”选项就没有意义了，相当于该域未附加“检查表单”动作。

[文章尾部最后300字内容到此结束,中间部分内容请查看底下的图片预览]

以上为《网页制作课件》的无排版文字预览，完整格式请下载

下载前请仔细阅读上面文字预览以及下方图片预览。图片预览是什么样的，下载的文档就是什么样的。