网页设计HTML中表单网页设计教案.docxVIP

教学项目十六 HTML中表单网页设计（二） 【教学内容】 讲解HTML中复选框、多行文本框、下拉列表的使用 【教学目的】 使学生掌握综合性表单的制作 【教学重点】 HTML综合性表单设计 【教学难点】 理解表单中相应元素对应标志及属性的含义 【教学方式】 案例分析式、项目教学 【教学参考】 JavaScript入门与提高杨浩著 清华大学出版社 JavaScript从入门到精通 电脑报社出版 TML网页制作教程 材义语编著铁道出版社 HTML基础与实例 程耀编著电子工业出版社 【新课】 一、HMTL中表单元素的使用 复选框 格式： vi叩ut type=checkbox name二字段名 value=字段值 checked 多行文本框 格式： textarea name=字段名rows=滚动文本框行数，cols=滚动文本框一行中的字符数〉/textarea 下拉列表 格式： sclect namc=字段名、126=显示的列表项数multiplc option value=值 selected显示列表项值/option /select 说明： size:指定屏幕上下拉列表中同时显示的选项个数 multiple:设定是否可以复选（同时按住组合键CTRL+SHIFT实现复选操作）selected:设定选项己选中 例1:设计网页设计大赛作品征集网页 U 我的个人网页—BierosroTt Iwterne-t Explorer 文件(E) 1) 近石(V) 收球 0) XH(I) ffifth 01) 凶回lb /按亲，收 凶回lb /按亲，收I哄—媒体?合― :乜tlb I 1 4^1 G： \FrontPaccVhtmlzan.plc\a4. htm 网页设讦大家作品彳正来奏 网页设讦大家作品彳正来奏 EMAIL EMAIL 弗JT乍 BrtQ 2003 v 佐政朋的k*工耳 弗JT乍 BrtQ 2003 v 佐政朋的k*工耳 B FRONTPAGE 口 DRE ?也介细 AVER O JavaScript □ FLASH 诺与出不超过200字的隅 场绍 希完毕 希完毕 2我的电脂 记砺本 - 艮我的个... EN 0 , 17 28 程序代码如下： HTML Head vti〔le我的个人网页/title /head body background=l I .gif form p align=centerfont size=5 face=隶书〉网页设计大赛作品征集表/p table border= 1 align=center tr vid姓名 vinpul type=text name=xm size= 10/tdvidEMAILvinput type二password size=12 name=mail/td/trlr td colspan=2性另ijvinput typc=radio name=sex valuc=^^input type=radio name=sex value=々女 /td /trtr td colspan=2 制作时间select option value=2001 200 l/optionoption valueoptionoption valueoptionoption valueoptionv/select 年 select option value= 1 1 /optionoption value=22/optionoption value=33/optionoption value=44/optionoption value=55/optionoption value=66/optionoption value=77/optionoption value=88/optionoption value=99/optionoption value= 1 () 11 /optionoption value= 12 12/optionv/select 月 select option value= 1 1 /optionoption value=22/optionoption value=33/optionoption value=44/optionoption value=55/optionoption value=66/optionoption value=77/optionoption value=88/optionoption value=99/optionoplion value= 10 10/optionoption value=l 11 l/option