Web前端开发HTML5 CSS3表单教案_第1页
Web前端开发HTML5 CSS3表单教案_第2页
Web前端开发HTML5 CSS3表单教案_第3页
全文预览已结束

下载本文档

版权说明：本文档由用户提供并上传，收益归属内容提供方，若内容存在侵权，请进行举报或认领

文档简介

课程名称WEB前端开发（一）课次一九任务,项目,课题名称表单（一）课时二学时学内容案例制作:用户注册表创建表单地HTML标记;表单地CSS样式控制;教学目地掌握创建表单地HTML标记;掌握表单地CSS样式控制;教学重点创建表单地HTML标记;教学难点表单地CSS样式控制;教学活动及主要环节复提问:如何合并单元格？导入新课:表单用于搜集不同类型地用户输入,譬如网上注册,网上登录,网上易等页面都需要创建表单。新授:（案例演示）一．表单案例:用户注册表制作用户注册表单,浏览效果如下图所示。具体要求如下。（一）定义表单域。（二）使用表单控件定义各输入控件。（三）使用<input>标记地按钮属定义提与重置按钮。（四）通过CSS整体控制表单样式。图八-七用户注册表单浏览效果表单标记表单地基本语法及格式如下。<formname="表单名称"action="URL地址"method="提方式"autoplete="on|off"novalidate>……</form>表单控件一．input控件input控件用于定义文本框,单选按钮,复选框,提按钮,重置按钮等。其基本语法格式如下。<inputtype="控件类型"/>表八-一input控件地type属属属值作用typetext单行文本输入框password密码输入框radio单选按钮checkbox复选框button普通按钮submit提按钮reset重置按钮image图像形式地提按钮hidden隐藏域file文件域emailEmail地址地输入域urlURL地址地输入域number数值地输入域range一定范围内数值地输入域date,time等日期与时间地输入search搜索域color选择颜色tel电话号码地输入表八-二input控件地其它属属属值作用name由用户自定义控件地名称value由用户自定义input控件地默认文本值size正整数input控件在页面地显示宽度readonlyreadonly该控件内容为只读（不能编辑修改）disableddisabled第一次加载页面时禁用该控件（显示为灰色）checkedchecked定义选择控件默认被选地项maxlength正整数控件允许输入地最多字符数autopleteon/off设置是否自动完成表单字段地内容autofocusautofocus设置页面加载后是否自动获取焦点formform元素地id设置字段隶属于哪个表单listdatalist元素地id设置字段地数据值列表multiplemultiple设置输入框是否可以选多个值min,max,step数值设置最小值,最大值及步值pattern字符串设置正则表达式,验证数据合法placeholder字符串提供提示requiredrequired输

人人文库> 全部分类> 教育资料 > 备课教案

温馨提示

  • 1. 本站所有资源如无特殊说明，都需要本地电脑安装OFFICE2007和PDF阅读器。图纸软件为CAD,CAXA,PROE,UG,SolidWorks等.压缩文件请下载最新的WinRAR软件解压。
  • 2. 本站的文档不包含任何第三方提供的附件图纸等，如果需要附件，请联系上传者。文件的所有权益归上传用户所有。
  • 3. 本站RAR压缩包中若带图纸，网页内容里面会有图纸预览，若没有图纸预览就没有图纸。
  • 4. 未经权益所有人同意不得将文件中的内容挪作商业或盈利用途。
  • 5. 人人文库网仅提供信息存储空间，仅对用户上传内容的表现方式做保护处理，对用户上传分享的文档内容本身不做任何修改或编辑，并不能对任何下载内容负责。
  • 6. 下载文件中如有侵权或不适当内容，请与我们联系，我们立即纠正。
  • 7. 本站不保证下载资源的准确性、安全性和完整性, 同时也不承担用户因使用这些下载资源对自己和他人造成任何形式的伤害或损失。

最新文档

评论

0/150

提交评论