当前位置：文档之家 › 第07讲 HTML标签库及表单的应用.ppt

第07讲 HTML标签库及表单的应用.ppt

  • 格式：ppt
  • 大小：1.14 MB
  • 文档页数：23
第07讲 HTML标签库及表单的应用.ppt

合集下载

HTML5网页设计与制作教学课件第七章使用表格

HTML5网页设计与制作教学课件第七章使用表格

第7章
使用表格
第7章 使用表格
在生活中表格随处可见，如账表、明细表、成绩表 、数据表等，在网页中也是一样。制作网页的时候， <table>表格标签是最常用的，也是最必不可少的工具 。表格拥有特殊的结构和布局模型，能够比较醒目地 描述数据间的关系，如果借助 CSS设计表格样式，可 以帮助用户在阅读数据时更便捷、更轻松。
【拓展练习】
使用border-spacing属性分离单元格时，应该注意三个问题。
第一，早期版本的IE浏 览器不支持该属性，要定义 相同效果的样式，就需要同 时结合 HTML的cellspacing属性来设置。
第二，当使用border-spacing
属性时，应确保数据单元格之间的相
互独立性，不能再使用border-
【拓展练习】
利用CSS的padding属性可以更灵活地定制单元格补白区域的大小，也可以根据需要定义不同边 上的补白。使用padding属性还可以为表格定义补白，此时可以增加表格外框与单元格的距离。以上 面的示例为基础，重新定义内部样式表，在<head>标签内的<style type="text/css">标签中清除 其他表格样式，添加如下样式。
新建一个网页，保存为 test.html，在 <body>内使用 <table>、<tr>、<th>和<td>标签
设计一个简单的表格，然后使用HTML的colspan、rowspan属性合并相邻单元格中的相同项目，
代码如下所示。
7.1 设计表格结构
7.1.2 设计表格附加结构
【随堂练习 】
在IE浏览器中预览演示效果，如图7-4所示。
HTML制作表单ppt课件

HTML制作表单ppt课件


name=“login”>
用户名：<input type ="text" name="userName"/> <br/>
年 龄：<input type="text" name="age"/> <br/>
<input type="submit"/>
action属性值：url地址
</form> Nhomakorabea相对或绝对路径
• 创建图像按钮
• <input type=“image” scr=“图像地址” name=“控
件名称”/>
▪ type属性：image ▪ name属性值：控件名称 ▪ src属性值：图像文件地址
代码 示例
22
<input>——隐藏控件
• 创建隐藏控件
• <input type=“hidden” name=“控件名”/>
• size属性：文本框长度
• maxlength属性：文本框最多输入字符数
• value属性：文本框中默认值
代码 示例
15
<input>——密码框
• 创建一个密码文本框 • <input type="password" name="名称" size="NB"
maxlength="NB"/>
• type属性值：password • name属性值：控件名称 • size属性值：指定密码框大小 • maxlength属性值：允许输入最多字符 • 输入的文本显示为密码形式
HTML 表单ppt课件

HTML 表单ppt课件

label标签的for属性应当与相关元素的id属性相同labelforman男labelinputtyperadionamesexvalue男idman表单元素标记2021精选ppt145多行文本框textareaname多行文本框名称cols每行中的字符数rows显示的行数初始内容textarea表单元素标记2021精选ppt156列表框a菜单式selectname列表框名称optionselectedselected哪个为初始选择就添加selected语句只有一个value提交值列表1optionoptionvalue提交值列表2optionselect分组optgrouplabel分组名称optgroup表单元素标记2021精选ppt16例如
最新课件
25
7. 多行文本：<textarea rows="" cols=""></textarea> 8. 按钮
1. 提交按钮 <input type="submit" value="" /> 2. 重置按钮 <input type="reset" value="" /> 3. 普通按钮 <input type="button" value="" /> 4. 图片按钮 <input type="image" src="" />
最新课件
27
<form action="Echo64.asp" method="POST">
最新课件
28
<% name = Request("Name")
HTML表单实例.ppt

HTML表单实例.ppt

• 背景色彩和文字色彩 – <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.
• 图象和文字的对齐 <img align=#> #=top, middle, bottom
<img src=URL align=right>My Face!<br> It is always<br> smiling.<br> Hahaha....<br>
My Face! It is always smiling. Hahaha....
#= 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