欢迎来到天天文库
浏览记录
ID:8850092
大小:44.00 KB
页数:7页
时间:2018-04-09
《表单网页的制作方法》由会员上传分享,免费在线阅读,更多相关内容在应用文档-天天文库。
1、表单网页的制作方法教学目的:1、理解表单的概念及作用;2、熟悉表单字段的种类和功能;3、掌握表单网页的制作方法。教学重点:1、表单作用的理解和表单网页的制作。2、如何验证表单元素的正确性。教学难点:1、如何将表单具体应用,设计出精美网页。2、如何验证表单元素的正确性。新课内容:一、表单的概念及作用 表单(Form)是一种结构化的文件,用于收集和发布信息。它是网站管理员与访问者进行交流的一种媒介,通过访问者填写表单中的选择题、填空题和问答题,网站管理员可以收集到来自世界各地的资料和意见。目前表单主要用来进行意见调查、在线查询、网上购物、
2、在线申请等。在表单中经常出现的字段有:单行文本框、多行滚动文本框、单选框、复选框、下拉列表框和按钮。二、HTML表单设计基础 表单在HTML页面中起着重要作用,它是与用户交互信息的主要手段。一个表单至少应该包括说明性文字、用户填写的表格、提交和重填按钮等内容。用户填写了所需的资料之后,按下“提交资料”按钮,这样所填资料就会通专门的CGI接口传到Web服务器上。网页的设计者随后就能在Web服务器上看到用户填写的资料,从而完成了从用户到作者之间的反馈和交流。对于免费个人网站,往往服务器不提供CGI功能,也可以电子邮件来接收用户的反馈信息。
3、 表单中主要包括下列元素:button——普通按钮radio——单选按钮checkbox——复选框select——下拉式菜单text——单行文本框textarea——多行文本框submit——提交按钮reset——重填按钮 用HTML设计表单常用的标记是:
4、
5、postname=valueonreset=functiononsubmit=functiontarget=window>
6、户信息采用这种方式。name:用于设定表单的名称。onrest和onsubmit是主要针对“reset”按钮和“submit”按钮来说的,分别设定了在按下相应的按钮之后要执行的子程序。target:指定输入数据结果显示在那个窗口,这需要与标记配合使用。2、表单输入标记 此标记在表单中使用频繁,大部分表单内容需要用到此标记。其语法如下:7、righ8、top9、middle10、bottomname=valuetype=text11、textarea12、password13、checkbox14、radi15、o16、submit17、reset18、file19、hidden20、image21、buttonvalue=valuesrc=urlcheckedmaxlength=nsize=nonclick=functiononselect=function>align:是用于设定表单的位置是靠左(left)、靠右(right)、居中(middle)、靠上top)还是靠底(bottom)。name:设定当前变量名称。type:决定了输入数据的类型。其选项较多,各项的意义是:type=text:表示输入单行文本;typet=textarea:表示输入多行文本;type=p22、assword:表示输入数据为密码,用星号表示;type-checkbox:表示复选框;type-radio:表示单选框;type一submit:表示提交按钮,数据将被送到服务器;tyPe-reset:表示清除表单数据,以便重新输入;type-file:表示插入一个文件;type-hidden:表示隐藏按钮;type=image:表示插入一个图像;type一button:表示普通按钮;value:用于设定输入默认值,即如果用户不输入的话,就采用此默认值;src:是针对type=image的情况来说的,设定图像文件的地址;checked:表示23、选择框中,此项被默认选中;maxlength:表示在输入单行文本的时候,最大输入字符个数;size:用于设定在输入多行文本时的最大输入字符数,采用width,height方式;o
7、righ
8、top
9、middle
10、bottomname=valuetype=text
11、textarea
12、password
13、checkbox
14、radi
15、o
16、submit
17、reset
18、file
19、hidden
20、image
21、buttonvalue=valuesrc=urlcheckedmaxlength=nsize=nonclick=functiononselect=function>align:是用于设定表单的位置是靠左(left)、靠右(right)、居中(middle)、靠上top)还是靠底(bottom)。name:设定当前变量名称。type:决定了输入数据的类型。其选项较多,各项的意义是:type=text:表示输入单行文本;typet=textarea:表示输入多行文本;type=p
22、assword:表示输入数据为密码,用星号表示;type-checkbox:表示复选框;type-radio:表示单选框;type一submit:表示提交按钮,数据将被送到服务器;tyPe-reset:表示清除表单数据,以便重新输入;type-file:表示插入一个文件;type-hidden:表示隐藏按钮;type=image:表示插入一个图像;type一button:表示普通按钮;value:用于设定输入默认值,即如果用户不输入的话,就采用此默认值;src:是针对type=image的情况来说的,设定图像文件的地址;checked:表示
23、选择框中,此项被默认选中;maxlength:表示在输入单行文本的时候,最大输入字符个数;size:用于设定在输入多行文本时的最大输入字符数,采用width,height方式;o
此文档下载收益归作者所有