第03章 表单和框架.ppt

* 讲解要点： * 讲解要点： * 第三章 表单和框架 回顾 使用HTML创建一个表格至少需要哪些标签？ 跨多行表格是在单元格里用哪个属性进行设置 ？ 对表格进行美化，主要用哪些属性进行设置？ 本章任务 制作“注册”页面制作“客户中心”页面 会使用表单的基本结构制作表单页面 会使用各种表单元素实现注册页面 能理解post和get两种提交方式的区别 会使用框架结构实现多窗口展示页面 本章目标 表单 表单的典型应用 注册用户 收集信息 反馈信息 为网站提供搜索工具 注册用户 收集信息 反馈信息 提供搜索工具 表单包含的控件 单行文本输入框(TEXT) 单选按钮(RADIO) 复选框(CHECKBOX) 下拉列表(SELECT) 重置按钮(RESET) 提交按钮(SUBMIT) 多行文本框(TEXTAREA) 密码框(PASSWORD) 表单页面的基本结构 METHOD =“post或get” ACTION METHOD 指定提交后，由服务器上那个处理程序处理 指定向服务器提交的方法: 一般为post或get方法, post方法比较安全 ACTION = “URL” FORM action=“” method=“post” …… /FORM 表单元素的统一格式 FORM name=form3 method=post action=INPUT type=checkbox name=gen value=男size=21“ maxlength=4 checked=checked…… /FORM 指定元素的类型，可为TEXT、RADIO、SUBMIT等 控件的名称 控件的初始值 控件的初始宽度 控件中输入的最多字符个数 控件是否被选中 表单元素的逐一介绍 文本框基本语法 INPUT type=“text ” value=张三 size=20 FORM name=form1 method=post action= P名nbsp;nbsp;字：INPUT type=text value=张三 size=20 /P …… /FORM 单行文本输入框，字符宽度为20 文本区的宽度 输入元素的默认值 文本输入框 表单元素的逐一介绍 密码框基本语法 INPUT type=“password ” value=“ 123456 ”size=“22” 密码区宽度 初始密码 密码框 FORM name=form2 method=post action= …… P密nbsp;nbsp;码：INPUT value=“ 123456 ” type=password size=22 /P /FORM 密码框，22个字符宽度 表单元素的逐一介绍 单选按钮基本语法 INPUT type=radio value=男 checked=checked 初始值 单选按钮 默认选中 FORM name=form3 method=post action= BR性别： INPUT name=gen type=radio class=input value=男 checked IMG src=images/Male.gif width=23 height=21男nbsp;…… /FORM 设置此单选按钮被选中 表单元素的逐一介绍 复选框基本语法 INPUT type=“checkbox” name=cb2 value=talk 复选框 复选框名 复选框值 FORM name=form4 method=post action=……LABELINPUT type=checkbox name=cb2 value=talkchecked=checked/LABEL聊天nbsp;nbsp;…… /FORM 设置此复选框被选中 列表框基本语法 select name=“指定列表名称” size=“行数”option value=“可选项的值” selected…/option option value=“可选项的值” …/option…… /select 说明：size确定列表中可同时看到的行数。selected默认被选中的可选项。 表单元素的逐一介绍 出生日期： INPUT name=byear value=yyyy size=4 maxlength=4 nbsp;年 SELECT name=bmonOPTION value= selected[选择月份] /OPTIONOPTION value=0一月/OPTIONOPTION value=1二月/OPTION…… /SELECT 月nbsp; INPUT name=bday value=dd size=2 maxlength=2 日 设置此输入框最