HTML+CSS+DIV网页设计与布局 教学课件 ppt 作者 聂斌 1_ 第6章 表单

上传人:E**** 文档编号:89494934 上传时间:2019-05-25 格式:PPTX 页数:19 大小:869.78KB
返回 下载 相关 举报
HTML+CSS+DIV网页设计与布局 教学课件 ppt 作者  聂斌 1_ 第6章  表单_第1页
第1页 / 共19页
HTML+CSS+DIV网页设计与布局 教学课件 ppt 作者  聂斌 1_ 第6章  表单_第2页
第2页 / 共19页
HTML+CSS+DIV网页设计与布局 教学课件 ppt 作者  聂斌 1_ 第6章  表单_第3页
第3页 / 共19页
HTML+CSS+DIV网页设计与布局 教学课件 ppt 作者  聂斌 1_ 第6章  表单_第4页
第4页 / 共19页
HTML+CSS+DIV网页设计与布局 教学课件 ppt 作者  聂斌 1_ 第6章  表单_第5页
第5页 / 共19页
点击查看更多>>
资源描述

《HTML+CSS+DIV网页设计与布局 教学课件 ppt 作者 聂斌 1_ 第6章 表单》由会员分享,可在线阅读,更多相关《HTML+CSS+DIV网页设计与布局 教学课件 ppt 作者 聂斌 1_ 第6章 表单(19页珍藏版)》请在金锄头文库上搜索。

1、第6章 表单,在现实生活中,总会要填很多表,如入学申请表、健康体检表等等,如果把这些表格放在网上,就是HTML中的表单。表单是实现动态页面的一种主要外在形式,也就是说表单是进行用户和浏览器交互的重要手段。,6.1 添加表单,表单可以用来收集用户在客户端提交的各种信息,例如在网站登录或注册时进行的键盘和鼠标操作,都是通过表单作为载体传递给服务器的。表单其实是页面中的一个特定的区域,由标记和标记定义,所有的表单元素都要在这对标记之间才有效。表单的基本语法如下所示: 设置各种表单元素 ,6.1.1 链接跳转,ACTION属性是用来设置链接跳转,也就是在提交表单的内容的时候,按照链接地址跳转到相应的页

2、面进行处理。由于ACTION属性是用来控制整个表单的提交内容,所以ACTION属性要写在标签里面。其语法结构如下所示: 设置各种表单元素 ,6.1.1 链接跳转,例如以下代码,说明将表单提交到绝对路径“http:/ 以下代码说明将表单提交到绝对路径“http:/ 以下代码说明将表单提交到相对路径“searcher.asp”上,其中searcher.asp文件是用于接收并处理表单的程序。 ,6.1.2 链接跳转方式,设置了链接跳转ACTION以后,还需要设置当链接跳转时所使用的跳转方法。可以通过METHOD属性来进行设置,它决定了表单中已收集数据是用什么样的方法发送到服务器的。其语法结构如下所示

3、: 表单元素 表单的链接跳转方式一般可以设置为get和post两种,其具体含义如下表所示。,6.1.3 表单名称,表单名称标记主要是为了区分各个表单,因为有时候在一个页面中可能会有多个表单,或者在一个表单处理程序中需要处理多个页面的表单,这时候表单名称就显得尤其重要了。表单名称的标记是NAME,其语法是: 表单元素 ,6.2 输入标签,输入标签是使用最广泛的表单控件元素,用于定义输入域的开始。标签是单标签,所以在使用时,要为标签加上“/”号,来达到标签的闭合。标签必须嵌套在表单标记中使用。其语法结构如下所示: ,6.2.1 文本框,文本框就是用来在输入框中输入任何类型的数字、文本以及字母等,输

4、入的内容单行显示在页面中,可以通过TYPE=“text“来进行设置。其语法如下所示: ,6.2.2 密码框,密码输入框是用来输入密码的,可以通过TYPE=“password“来进行设置。设置以后,在密码输入框中输入的内容就会变成小黑点或者是“*”号,可以用来保护密码不被第三者看见。其语法结构如下所示: ,6.2.3 单选框,单选框是指只能选择其中一项的选项框,就像很多表单中的“性别”选项一样,要么是男,要么是女,不可能同时是男又是女。因此,可以将性别这一单元中设置成为单选框,让用户选择,选中的选项会以圆点显示。单选框可以通过TYPE=“radio“来进行设置,其语法如下所示: ,6.2.4 复

5、选框,复选框与单选框类似,可以是一个单独的复选框,也可以是多个复选框组成的复选框组。复选框可以让用户同时在表单中选择或取消多个选择项目,在浏览器中通常表现为一个小方框,当用户选中复选框时,会在小方框里打上一个勾。如果用户没有选中该选项或取消该复选框时,小方框里为空。复选框可以通过TYPE=“checkbox“来进行设置,其语法如下所示: ,6.2.5 提交按钮,提交按钮是把表单里的信息提交到指定的数据库或者其他地方。可以通过TYPE=“submit“来进行设置,其语法结构如下所示: ,6.2.6 重置按钮,重置按钮的作用是将表单中的用户输入清除,将内容恢复到初始状态。重置按钮可以通过TYPE=

6、“reset“来进行设置,其语如下所示: ,6.2.7 图像按钮,图像按钮是指将页面中的按钮使用图片显示外观,这样的图片可以具有按钮的功能,而且页面也更加美观。图像按钮可以通过TYPE=“image“来设置,其语法如下所示: ,6.2.8 文件域,文件域可以让用户选择存储在本地计算机上的文件,通常用于文件上传到服务器上时进行文件的选择。文件域在浏览器里的显示为一个文本框与一个按钮,通常按钮上会显示“浏览”字样。文件域可以通过TYPE=“file“来设置,其语法如下所示: ,6.2.9 隐藏域,隐藏域作用是在表单里放入一个不希望被用户看到或用户没有必要看到的内容,而这些内容往往都是在提交表单时,

7、服务器或脚本需要获取的内容。隐藏域可以通过TYPE=“hidden“来设置,其语法如下所示: ,6.3 下拉列表,下拉列表框是一个下拉式的列表或者带有滚动条的列表,用户可以在列表中选择一个选项。创建下拉列表框需要用到两个元素,首先要用到的是SELECT元素,用于标记下拉列表框开始,然后要用到的是OPTION元素,用于创建下拉列表框里的项目。如果一个下拉列表框里有多个可选项目,只需要重复使用OPTION元素。下拉列表语法如下所示: 选项内容 选项内容 选项内容 ,6.4 文本域,单行文本框只是在网页中显示一个只能输入一行文字的文本框,如果用户有大量的文字尤其是分段的多行文字,在单行文本框里是无法输入的。HTML中提供了一个元素,使用该元素可以在网页里创建一个文本域。在多文本域里可以显示多行文字,也可以输入多行文字,在很大程度上方便用户输入和查看文字。文本域语法结构如下所示: 输入的内容 ,6.5 小结,本节主要介绍了HTML中表单的使用。详细讲解了表单中的输入标签、下拉列表和文本域。其中,输入标签讲解了文本框、密码框、单选框、复选框、提交按钮、重置按钮、图像按钮、文件域和隐藏域。,

展开阅读全文
相关资源
相关搜索

当前位置:首页 > 高等教育 > 大学课件

电脑版 |金锄头文库版权所有
经营许可证:蜀ICP备13022795号 | 川公网安备 51140202000112号