第04讲 HTML语言(二)和层叠样式表.ppt

WEB 编 程 计算机科学与技术系 张永定 ydzhang@ 第四讲 HTML语言（二）和层叠样式表 内容回顾 HTML 文档的结构 HTML 段落标记 字符格式化标记 在网页中使用列表 在网页中使用图形 在网页中使用超链接 在网页中使用表格 本讲内容 表单 表单元素 框架 样式表 层 在 HTML 文档中插入多媒体 小结 作业布置 表单的用途 在用户注册某种服务时收集用户的姓名、地址、电话号码、电子邮件地址等其他信息 为购买商品而收集信息 收集关于网站的反馈信息 为网站提供搜索工具。提供各种信息的网站通常会为用户提供一个搜索框，使用户能够更快地找到信息 网页上的一个典型表单如下所示： INPUT元素 4-1 INPUT元素 4-2 INPUT元素 4-3 Button 创建按钮 Text 单行文本框 Password 口令输入框 File 文件 Hidden 隐藏域 INPUT元素 4-4 TEXTAREA 元素 BUTTON 元素 TEXTAREA元素和BUTTON元素示例 SELECT 元素 2-1 SELECT 元素 2-2 OPTGROUP 元素 2-1 OPTGROUP 元素 2-2 LABEL元素 创建表单 2-1 创建表单 2-2 框架的用途 在页面的一个固定部分显示徽标或静态信息 用作网页中的目录，用户可以通过单击目录在网站中导航，而无需经常地返回到目录页面 提供多视图效果，使设计人员可让网页中的某些信息保持静止，而滚动或操纵其他内容 FRAMESET元素 2-2 FRAME元素的常用属性2-1 FRAME元素的常用属性2-2 使用框架 4-1 使用框架 4-2 使用框架 4-3 使用框架 4-4 链接到框架 2-1 如果在某个元素的 TARGET 属性中指定了一个目标框架，则在激活该元素时，元素所指定的文档将被加载到该目标框架中。 如果该元素没有设置 TARGET 属性，则使用BASE 元素的 TARGET 属性确定目标框架。 如果该元素和 BASE 元素都没有指定目标，则文档将被加载到包含该元素的框架中。 如果找不到目标框架，浏览器将新建一个窗口，并将文档加载到新窗口中。 链接到框架 2-2 NOFRAMES 元素 NOFRAMES 元素用于指定要使用的替代内容。它仅在浏览器不支持框架时才起作用。 内嵌框架：IFRAME 元素 样式表简介 概念与功能 样式表：包含HTML元素样式定义的列表。 样式规则：定义元素内文本的样式。例如，可以创建一个样式规则，指定所有 H1 标题均显示为蓝色。 行内样式 链接外部样式表 导入样式表 层简介 层示例 层的特征 使用层3-1 使用层3-2 使用层3-3 本讲小结 表单 表单元素 框架 样式表 层 在 HTML 文档中插入多媒体 作业布置 简答题 无 HTML FRAMESET COLS=40%, 60% FRAME SRC=link.htm NAME=links SCROLLING=no FRAMEBORDER=no FRAME SRC=football.gif NAME=football SCROLLING=auto /FRAMESET /HTML main.htm HTML BODY BASE TARGET=football PA HREF=C:/event.htm事件/AP PA HREF=C:/teams.htm球队/AP /BODY /HTML link.htm HTML FRAMESET COLS=40%,60% FRAME SRC=football.gif NAME=football SCROLLING=yes FRAMESET ROWS=60,* FRAME SRC=C:/event.htm NAME=EVENT SCROLLING=no FRAMEBORDER=no FRAME SRC=C:/teams.htm NAME=TEAMS NOFRAMES框架未显示。单击此处 A href=main.htm 以便使用没有框架的版本。/A /NOFRAMES /FRAMESET /FRAMESET /HTML 此属性指定内嵌框架的高度 HEIGHT 此属性指定内嵌框架的宽度 WIDTH 此属性给当前框架指定名称 NAME 说明 属性 IFRAME 元素用于定义内嵌或浮动框架 可以在文本块中创建和插入框架 如果浏览器不支持框架，封在 IFRAME 标记内的内容就会显示 内嵌框架的大小不能调整 IFRAME 元素 HTML P框架是很有趣的。您一直在学习框架的知识 BRBR IFRAME SRC=C:/event.htm width=100 height=150 SCR