在网页中创建表单和样式

《在网页中创建表单和样式》由会员上传分享，免费在线阅读，更多相关内容在应用文档-天天文库。

1、85第3章在网页中创建表单和样式第3章在网页中创建表单和样式教学提示：在Internet上使用表单主要是为了实现浏览者同Internet服务器之间的交互。通过表单，可以将浏览者的信息发送到Internet服务器上，以供处理。表单也可以使用户与站点的浏览者交互。例如，用户可以询问浏览者的用户名称和电子邮件地址，或者对浏览者做一个调查，签一下访客簿，或者提供关于用户的站点信息反馈。在Dreamweaver中，用户还可以快速地设置CSS样式，这更突出了使用Dreamweaver来格式化文本的功能。CSS是网页设计中众多样式的集成，使

2、用CSS可以使页面风格统一化和标准化。CSS提供的链接功能可以让所有的网页使用同一种样式，需要改变页面的风格时，只需要改变CSS文件中对样式进行注释的内容就可以了。本章将介绍利用Dreamweaver在页面中创建、设置表单和怎样在Dreamweaver中快速地设置CSS样式制作网页。教学目标：通过本章的学习，要求用户掌握创建和设置表单的方法，了解CSS样式的基本知识，掌握使用CSS样式制作网页的方法。3.1使用表单制作动态网页表单是网页设计者与网页的访问者进行交流的工具，其作用就是从访问Web站点的用户那里获得信息。作为一个优

3、秀的网页设计工具，DreamweaverMX2004为用户提供了简单快捷的表单建立方法。表单中包括：单选按钮、复选框、列表、菜单、文本域(单行、多行、密码)及按钮等元素。部分元素的显示状态如图3.1所示。列表按钮文本域(单行)单选按钮图3.1表单部分组成元素85第3章在网页中创建表单和样式3.1.1创建表单域当访问者在网页的表单对象内输入信息后，这些信息将被程序处理，或者发到规定的邮箱里，于是需要给出网页一个范围。只有在该范围内的表单对象中的信息才会被发送，这个范围就叫做表单域。要创建表单，可执行如下操作：(1)鼠标单击要插入

4、表单的位置。(2)选择【插入】

5、【表单】

6、【表单】命令，或单击【插入】面板上的【表单】选项卡中的【表单】按钮，此时在编辑区里可看到一个红色虚线的矩形区域，这个方框就是表单域，如图3.2所示。图3.2表单域通过表单收集到的用户反馈信息，通常是一些用分隔符(如逗号、分号等)分隔的文字资料。这些资料可以导入到数据库或电子表格中进行统计、分析，成为具有重要参考价值的信息。使用Dreamweaver可以创建表单，可以在表单中添加对象，还可以通过使用行为来验证用户输入信息的正确性。此时，用户需使用文本编辑器自行编写脚本或应用程序以处理表单

7、数据。最常用的表单处理脚本语言是ASP，其他可选的语言还有C，Java以及JavaScript等。3.1.2文本字段/文本区域除了让浏览者就设计者给出的选项进行选择之外，表单还可以让浏览者自己输入文字信息，这对那些不能明确定义选项的情况十分适用。创建文本域有两种方法：l选择【插入】

8、【表单】

9、【文本区域】命令，创建文本域。l在【插入】面板上单击【表单】中的【文本区域】按钮。用户还可以利用【属性】面板对文本域进行设置。打开【属性】面板，选取文本域，【属性】面板变成如图3.3所示状态。85第3章在网页中创建表单和样式图3.3文本域

10、【属性】面板其中：l【文本域】：设置当前文本域的名字。l【字符宽度】：设置文本域在网页中的长度。注意，不是以像素而是以字数来定义的。l【行数】：设置允许用户输入的行数。l【类型】：其中的三个单选按钮用于设置文本域的类型，分别是单行、多行、密码，默认为多行。单行方式适用于输入姓名、证件号码等信息，多行方式常用于输入留言，而密码方式多用于输入密码。如果用户选择了【密码】单选框，那么这个文本域的内容就成为密码类型，它将以“*”形式显示。l【换行】：变成可选时，可输入换行设置(默认值为“Off”)，即显示横向坐标。注意：【字符宽度】的

11、数值决定文本域的可见宽度，而【行数】决定的是可输入的最大行数，两者的区别在脚本编辑时非常明显。图3.4是文本域的例子，其中包括密码类型的显示。图3.4一般文本域应用的例子3.1.3列表/菜单列表/菜单是一种非常有用的表单组件。利用它，设计者可以提供一系列的选项，让用户从中选择一项或多项，如职业、年龄等。两者的区别在于，列表是可滚动选项清单，且允许访问者选择多项；而菜单是弹出菜单，这种菜单仅在用户单击时才显示出来，且只能从中选择一项。要创建菜单，可执行如下操作：(1)选择【插入】

12、【表单】

13、【列表/菜单】命令，或单击【插入】面板

14、表单选项卡中的【列表/菜单】按钮。成功创建后，在光标所在位置就会出现一个列表/菜单元素。(2)列表/菜单的大小按照设计者给定的选项的长短而变化，因此不需要修改它的长度。选择一个列表/菜单，其【属性】面板如图3.5所示。(3)在【列表/菜单】文本框中输入“bm”，作为菜单的名称