第3章在网页中创建表单和样式.doc

第3章 在网页中创建表单和样式 教学提示：在Internet上使用表单主要是为了实现浏览者同Internet服务器之间的交互。通过表单，可以将浏览者的信息发送到Internet服务器上，以供处理。表单可以使站点的交互。例如，可以询问用户名称和电子邮件地址，或者做一个调查，签一下访客簿，或者提供关于的站点反馈。Dreamweaver在页面中创建、设置表单和怎样在Dreamweaver中快速地设置CSS样式制作网页。 教学目标：通过本章的学习，要求用户掌握创建和设置表单的方法，了解CSS样式的基本知识，掌握使用CSS样式制作网页的方法。 3.1 使用表单制作动态网页 表单是网页设计者与网页的访问者进行交流的工具，其作用就是从访问Web站点的用户那里获得信息。 作为一个优秀的网页设计工具，Dreamweaver MX 2004为用户 图3.1 表单部分组成元素 3.1.1 创建表单域 当访问者在网页的表单对象内输入信息后，这些信息将被程序处理，或者发到规定的邮箱里，于是需要给出网页一个范围。只有在该范围内的表单对象中的信息才会被发送，这个范围就叫做表单域。要创建表单执行下操作：要插入表单的位置) 选择【插入】|【表单】|【表单】命令，或单击【插入】面板上的表单按钮， 图3.2 表单域 通过表单收集到的用户反馈信息，通常是一些用分隔符(如逗号、分号等)分隔的文字资料。这些资料可以导入到数据库或电子表格中进行统计、分析，成为具有重要参考价值的信息。 使用Dreamweaver可以创建表单，可以表单中添加对象，还可以通过使用行为来验证用户输入信息的正确性。，使用文本编辑器自行编写脚本或应用程序以处理表单数据。最常用的表单处理脚本语言是，其他可选的语言还有C，Java以及JavaScript等。 .2 文本字段/文本区域 除了让浏览者就设计者给出的选项进行选择之外，表单还可以让浏览者自己输入文字信息，这对那些不能明确定义选项的情况十分适用。 创建文本域有两种方法： 选择【插入】|【表单】|【文本区域】命令，创建文本域。 在【插入】面板上单击【表单】中的【文本区域】按钮。 用户还可以利用【属性】面板对文本域进行设置。打开【属性】面板，选取文本域，【属性】面板变成如图3.3所示状态。 图3.3 文本域【属性】面板 其中： 【文本域】：设置当前文本域的名字。 【字符宽度】：设置文本域在网页中的长度。注意，不是以像素而是以字数来定义的。 【行数】：设置允许用户输入的行数。 【类型】：其中的三个单选按钮用于设置文本域的类型，分别是单行、多行、密码，默认为多行。单行方式适用于输入姓名、证件号码等信息，多行方式常用于输入留言，而密码方式多用于输入密码。如果用户选择了【密码】单选框，那么这个文本域的内容就成为密码类型，它将以“*”形式显示。 【换行】：变成可选时，可输入换行设置(默认值为“Off”)，即显示横向坐标。 注意：【字符宽度】的数值决定文本域的可见宽度，而【行数】决定的是可输入的最大行数，两者的区别在脚本编辑时非常明显。图3.4是文本域的例子，其中包括密码类型的显示。 图3.4 一般文本域应用的例子 3.1.3 列表/菜单 列表/菜单是一种非常有用的表单组件。利用它，设计者可以提供一系列的选项，让用户从中选择一项或多项是可滚动，且是弹出菜单，这种菜单仅在用户单击时才显示出来，且能从中选择一项创建执行下操作：。成功创建后，在光标所在位置就会出现一个列表/菜单元素。 (2) 列表/菜单的大小按照设计者给定的选项的长短而变化，因此不需要修改它的长 度。选择一个列表/菜单，其【属性】面板如图3.5所示。 (3) 在【列表/菜单】文本框中输入“bm”，作为菜单的名称。 (4) 在【类型】选项组中选取【菜单】单选按钮。 图3.5 【属性】面板 (5) 单击【列表值】按钮，弹出如图3.6所示的【列表值】对话框。 (6) 在【项目标签】栏中输入项目名称，在【值】栏中输入项目的值，按“Tab”键可以方便地在名称和值之间切换。输入项目的对话框如图3.7所示。 图3.6 【列表值】对话框 图3.7 输入项目的【列表值】对话框 (7) 可以在菜单中设置默认值。如果用户没有在菜单中做出选择而直接提交表单，浏览器将发送默认值。打开【属性】面板的扩展栏，在【初始化时选定】列表区中选择一个项目，将其作为默认值。如图3.8所示，选中了“”选项。 图3.8 设置默认值 创建列表与创建菜单十分类似，只不过在【类型】选项区中选取【列表】单选按钮，同时在【高度】文本框中设置控制列表的显示行数，在【选定范围】选项组中选中【允许多选】复选框中设置是否允许访问者作多项选择。图3.9所示为插