第6章 表单和CSS样式.pptVIP

第6章 表单和CSS样式表的应用 随着WWW的飞速发展，网页的动态功能也不断增强，表单也就成了动态网页中必不可少一个重要元素，表单是网页与访客的一种交互界面，主要用于数据采集（例如收集访客的名称、Email地址、调查表、留言簿等），也可以用于实现搜索。通过表单，实现了用户同Web站点服务器的信息交流。 对于一个网站来说，CSS样式是必不可少的。CSS即层叠样式表，是由W3C开发的一种HTML规范，用来统一页面的外观，对页面元素的显示效果进行精确控制，已经成为当前流行的网页制作技术。 6.1 表单应用 作为一个网页的设计者，总希望可以与访问者进行交流，为访问者提供更加快捷的浏览途径。此时，需要利用网页中的一种重要元素——表单。表单有两个组成部分：一是描述表单的HTML源代码，二是处理表单中数据的服务器端或客户端程序，可以是ASP、PHP、JSP应用程序等。 6.1.1 表单对象 表单对象是实现表单具体功能的网页元素，通过在表单中添加不同的表单对象，可以允许用户在表单中进行输入数据、选择等操作。Dreamweaver提供了一系列表单对象，在“插入”面板的“表单”类别下可以进行查看，如图6.1所示，每个表单对象都用于不同的目的。 6.1.2 添加表单对象 在Dreamweaver中，可以将整个页面创建成一个表单网页，也可以在页面的部分区域中添加表单，方法基本相同。将光标定位到要创建表单的位置，选择“插入”面板的“表单”类别下的“表单”选项，即可在页面中插入一个表单 插入表单后，页面中会显示一个红色虚线框，用户可通过属性检查器对表单的一些参数进行设置。 6.1.3 插入文本字段 文本字段是最常用的表单对象之一，几乎在所有的表单中出现，用于收集短小文本短语中的无结构数据。但文本字段只能接收有限的字符数，通常是255个。现在我们在表单中插入文本字段。 6.1.4 插入密码输入框 插入密码输入框和插入文本字段类似，只不过把“类型”设置为“密码”，设置后该文本字段变成密码输入框。当在密码输入框中输入内容时，所输入的内容被替换为星号或项目符号，以隐藏该文本。 6.1.5 插入文本输入区域 文本输入区域允许输入更多的文本。如果输入的文本超过了文本区域的自然空间，就会自动出现滚动条，来显示溢出的文本。 6.1.6 插入单选按钮 表单按钮控制表单操作，使用表单按钮可将输入表单的数据提交到服务器或重置该表单，还可以将其他已经在脚本中定义的处理任务分配给按钮。 Dreamweaver提供了两种方式来在表单中创建按钮：单个插入每个单选按钮或同时插入整个单选按钮组。如果单个插入单选按钮，将需要为每个按钮命名，以确保它们都使用同一名称。如果插入整个单选按钮组，它们的名称相同，但要对每个按钮添加辅助功能属性。 6.1.7 插入复选框 复选框允许在一组选项中选择多个选项。每个复选框都有它自己的名称和值，用户在表单中一次只能插入一个复选框。 6.1.8 插入列表 通过列表，用户可以在表单中显示一个下拉列表框，以供访客从不同选项中进行选择。列表中的选项是相互排斥的，如单选按钮组。也可以启用多个选择选项，就好比一组复选框。 6.1.9 插入按钮 表单按钮控制表单操作，使用表单按钮可将输入表单的数据提交到服务器或重置该表单，还可以将其他已经在脚本中定义的处理任务分配给按钮。 6.1.10 其他表单对象 前面几小节我们已经讲解了表单中常用的对象，在这一小节中，将讲述文件域、图像域和跳转菜单这3个表单对象。 6.2 CSS样式表应用 随着网络技术的日趋成熟和网络的进一步发展，人们对网页的要求已不仅仅满足于简单的发布信息。人们开始对网页的排版、格式和设计有了越来越高的要求，网页已经慢慢地接近了一种全新的艺术表现形式。1996年底诞生了一种CSS层叠样式表技术，现已成为在网页制作过程中普遍用到的技术。使用CSS技术，可以更轻松、有效地对页面的整体布局、字体、图像、颜色、背景和链接等元素实现更加精确地控制，完成许多使用HTML无法完成的任务。 6.2.1 什么是CSS CSS样式表的全名是Cascading Style Sheet，它可以定义HTML标签，按照列表的语法将许多文本、图片、表单、图层、表单等设计加以格式设置。在HTML语法中，常需要使用到一些设置颜色、文本大小、边框粗细等标签，而CSS就是在开始制作网页的时候将这些设置做好，从而不需要重复写入同样的标签，整个网页套用CSS设置的格式来实现。 CSS还具有强大的页面美化功能。通过CSS可以控制许多仅使用HTML标签无法控制的属性，并能轻而易举地实现各种特效。有了CSS的帮助，可以让网页大大减肥，更方便页面、网站的维护，让设计者在最短的时间内更新网站的相关格式与设计。 6.2.