HTML表单实例.ppt
合集下载
相关主题
- 1、下载文档前请自行甄别文档内容的完整性，平台不提供额外的编辑、内容补充、找答案等附加服务。
- 2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
- 3、如文档侵犯您的权益，请联系客服反馈,我们会尽快为您处理(人工客服工作时间：9:00-18:30)。
华师大软 件学院
2. HTML标签&实例
毛宏燕
华东师范大学软件学院
1
Steps
• HTML简介 • HTML标记 • 表单（FORM）
2
HTML的简介
• HTML 是 Hyper Text Markup Language 的第一个大写字 母的组合，中文意思为超文本标记语言.
•HT一ML个定H义TM了L文一件系是列一的个标包记含，有控H制TM网L标页记显的示文的本文文档件、字符、 • HTML标记告诉Web浏览器如何显示网页 •段落一，个文HT本ML中文嵌件入必图须像是、一声个音ht、m或动h画tm，l扩提展供名超的文文本件链接， •支持一脚个本HT语ML言文、件J可AV以A小用程记序事,本实现网页交互效果。
<i>苏轼</i> 字体缩细<s令m字a体ll稍>为一缩细首著名的唐诗</small> 加重语气</产b生od字y体>加粗 Bold 的效果 下标字 下<标/h字tml>
上标字 指数（平方、立方等）
标记 <b> <big> <em> <i> <small> <strong> <sub> <sup> <ins> <del> <s> <strike> <u>
文件格式标记
说明及作用
<p><b>横看成岭侧成峰</b></p> 粗体标记<f产o生n字t c体o加lo粗r的=效re果d><strong>远近高低各不同</strong></font> 字体加大<b令r字>体稍为加大 强调标记<b字i体g>出不现斜识体效庐果山真面目</big> 斜体标记<e字m体>出只现斜缘体效身果在此山中</em>
/UltraEdit/EditPlus/Dreamweaver编辑
<html> <head> <title>这是我的第一个网页</title> </head> <body> 这是我的第一个网页 <b>你好！</b> </body> </html>
HTML 标记
• HTML标记是用来组成HTML元素的 • HTML标记用两个尖括号”<>”括起来 • HTML标记一般是双标记，如<b>和</b> • 前一个标记是起始标记, 后一个标记为结束标记 • 两个标记之间的文本是html元素的内容 • 某些标记称为“单标记”,因为它只需单独使用就能完整
9
标记 <html> <body> <h1> …… <h6> <p> <br> <hr> <!--> <strong> <b> <i> <font> <big> <small> <strike> <ol> <ul> <li> <dl> <dt> <dd>
HTML 基本标记
说明及作用 文件声明，让浏览器知道这是 HTML 文件 设计文件格式及正文所在 一级标题标记变粗变大加宽程度与级数反比 段落标记为字、画、表格等之间留一空白行 换行标记令字、画、表格等显示于下一行 水平线 插入一条水平线 说明标记 为文件加上说明，但不被显示 加重语气 产生字体加粗 Bold 的效果 粗体标记 产生字体加粗的效果 斜体标记 字体出现斜体效果 字形标记 设定字形、大小、颜色 字体加大 令字体稍为加大 字体缩细 令字体稍为缩细 画线删除 为字体加一删除线 顺序列表 清单项目将以数字、字母顺序排列 无序列表 清单项目将以圆点排列 列表项目 每一标记标示一项列表项目 定义列表 列表分两层出现 定义条目 标示该项定义的标题 定义内容 标示定义内容
</html>
HTML文档基本结构
一个HTML文档的基本结构： • <html> • <head> • <title>标题</title> • </head>
• <body> • 正文 • </body> • </html>
7
• 例如：如果要在浏览器中显示一段粗体文本， 可以表示为： <b>国庆节放假通知</b>
<body text="#ff0000" bgcolor="#d8e4d7">
<html> <body> <p><b>横看成岭侧成峰</B></p> <font color=red>远近高低各不同</font><br> <h1>不识庐山真面目</h1> <h2>只缘身在此山中</h2> <h2>苏轼</h2> </body>
• 背景色彩和文字色彩 – <body bgcolor=# text=# link=# alink=# vlink=#> • bgcolor --- 背景色彩 • text --- 非可链接文字的色彩 • link --- 可链接文字的色彩 • alink --- 正被点击的可链接文字的色彩 • vlink --- 已经点击(访问)过的可链接文字的色彩 • #=rrggbb • 色彩是用 16 进制的 红－绿－蓝(red-green-blue, RGB) 值来表示。 16 进制的数码有: 0,1,2,3,4,5,6,7,8,9,a,b,c,d,e,f.
地表达意思,如<br>
ห้องสมุดไป่ตู้
标记的属性
<html> <body> <p><b>横看成岭侧成峰</B></p> <font color=red>远近高低各不同</font><br> <h1>不识庐山真面目</h1> <h2>只缘身在此山中</h2> <h2>苏轼</h2> </body> </html>
标记的属性
• 如果要对显示文本继续设置字体，可以表示为： < b><font size=“+2” face=“ 黑 体 ”color= “blue”>国庆节放假通知</font></b>
8
页面属性
• 语言字符集(Charsets)的信息 -<meta http-equiv="Content-Type" content="text/html;charset=#">
#= us-ascii, iso-8859-1, x-mac-roman, iso-8859-2, x-mac-ce, iso-2022-jp, x-sjis, x-euc-jp, euc-kr, iso-2022-kr, gb2312, gb_2312-80, x-euc-tw, x-cns11643-1, x-cns11643-2, big5
2. HTML标签&实例
毛宏燕
华东师范大学软件学院
1
Steps
• HTML简介 • HTML标记 • 表单（FORM）
2
HTML的简介
• HTML 是 Hyper Text Markup Language 的第一个大写字 母的组合，中文意思为超文本标记语言.
•HT一ML个定H义TM了L文一件系是列一的个标包记含，有控H制TM网L标页记显的示文的本文文档件、字符、 • HTML标记告诉Web浏览器如何显示网页 •段落一，个文HT本ML中文嵌件入必图须像是、一声个音ht、m或动h画tm，l扩提展供名超的文文本件链接， •支持一脚个本HT语ML言文、件J可AV以A小用程记序事,本实现网页交互效果。
<i>苏轼</i> 字体缩细<s令m字a体ll稍>为一缩细首著名的唐诗</small> 加重语气</产b生od字y体>加粗 Bold 的效果 下标字 下<标/h字tml>
上标字 指数（平方、立方等）
标记 <b> <big> <em> <i> <small> <strong> <sub> <sup> <ins> <del> <s> <strike> <u>
文件格式标记
说明及作用
<p><b>横看成岭侧成峰</b></p> 粗体标记<f产o生n字t c体o加lo粗r的=效re果d><strong>远近高低各不同</strong></font> 字体加大<b令r字>体稍为加大 强调标记<b字i体g>出不现斜识体效庐果山真面目</big> 斜体标记<e字m体>出只现斜缘体效身果在此山中</em>
/UltraEdit/EditPlus/Dreamweaver编辑
<html> <head> <title>这是我的第一个网页</title> </head> <body> 这是我的第一个网页 <b>你好！</b> </body> </html>
HTML 标记
• HTML标记是用来组成HTML元素的 • HTML标记用两个尖括号”<>”括起来 • HTML标记一般是双标记，如<b>和</b> • 前一个标记是起始标记, 后一个标记为结束标记 • 两个标记之间的文本是html元素的内容 • 某些标记称为“单标记”,因为它只需单独使用就能完整
9
标记 <html> <body> <h1> …… <h6> <p> <br> <hr> <!--> <strong> <b> <i> <font> <big> <small> <strike> <ol> <ul> <li> <dl> <dt> <dd>
HTML 基本标记
说明及作用 文件声明，让浏览器知道这是 HTML 文件 设计文件格式及正文所在 一级标题标记变粗变大加宽程度与级数反比 段落标记为字、画、表格等之间留一空白行 换行标记令字、画、表格等显示于下一行 水平线 插入一条水平线 说明标记 为文件加上说明，但不被显示 加重语气 产生字体加粗 Bold 的效果 粗体标记 产生字体加粗的效果 斜体标记 字体出现斜体效果 字形标记 设定字形、大小、颜色 字体加大 令字体稍为加大 字体缩细 令字体稍为缩细 画线删除 为字体加一删除线 顺序列表 清单项目将以数字、字母顺序排列 无序列表 清单项目将以圆点排列 列表项目 每一标记标示一项列表项目 定义列表 列表分两层出现 定义条目 标示该项定义的标题 定义内容 标示定义内容
</html>
HTML文档基本结构
一个HTML文档的基本结构： • <html> • <head> • <title>标题</title> • </head>
• <body> • 正文 • </body> • </html>
7
• 例如：如果要在浏览器中显示一段粗体文本， 可以表示为： <b>国庆节放假通知</b>
<body text="#ff0000" bgcolor="#d8e4d7">
<html> <body> <p><b>横看成岭侧成峰</B></p> <font color=red>远近高低各不同</font><br> <h1>不识庐山真面目</h1> <h2>只缘身在此山中</h2> <h2>苏轼</h2> </body>
• 背景色彩和文字色彩 – <body bgcolor=# text=# link=# alink=# vlink=#> • bgcolor --- 背景色彩 • text --- 非可链接文字的色彩 • link --- 可链接文字的色彩 • alink --- 正被点击的可链接文字的色彩 • vlink --- 已经点击(访问)过的可链接文字的色彩 • #=rrggbb • 色彩是用 16 进制的 红－绿－蓝(red-green-blue, RGB) 值来表示。 16 进制的数码有: 0,1,2,3,4,5,6,7,8,9,a,b,c,d,e,f.
地表达意思,如<br>
ห้องสมุดไป่ตู้
标记的属性
<html> <body> <p><b>横看成岭侧成峰</B></p> <font color=red>远近高低各不同</font><br> <h1>不识庐山真面目</h1> <h2>只缘身在此山中</h2> <h2>苏轼</h2> </body> </html>
标记的属性
• 如果要对显示文本继续设置字体，可以表示为： < b><font size=“+2” face=“ 黑 体 ”color= “blue”>国庆节放假通知</font></b>
8
页面属性
• 语言字符集(Charsets)的信息 -<meta http-equiv="Content-Type" content="text/html;charset=#">
#= us-ascii, iso-8859-1, x-mac-roman, iso-8859-2, x-mac-ce, iso-2022-jp, x-sjis, x-euc-jp, euc-kr, iso-2022-kr, gb2312, gb_2312-80, x-euc-tw, x-cns11643-1, x-cns11643-2, big5