HTML表格、框架使用大全

1、本节小结本节小结 本节小结本节小结 思考题思考题 框架框架 表格表格 主页 静态网站设计 网络技术系：李毓丽 本节小结本节小结 本节小结本节小结 思考题思考题 框架框架 表格表格 主页 添加或删除行和列添加或删除行和列 格式化表格格式化表格 为表格添加题注为表格添加题注 嵌套表格嵌套表格 本节小结本节小结 本节小结本节小结 思考题思考题 框架框架 表格表格 主页 本节小结本节小结 本节小结本节小结 思考题思考题 框架框架 表格表格 主页 本节小结本节小结 本节小结本节小结 思考题思考题 框架框架 表格表格 主页 本节小结本节小结 本节小结本节小结 思考题思考题 框架框架 表格表格 主页 本节小

2、结本节小结 本节小结本节小结 思考题思考题 框架框架 表格表格 主页 本节小结本节小结 本节小结本节小结 思考题思考题 框架框架 表格表格 主页 本节小结本节小结 本节小结本节小结 思考题思考题 框架框架 表格表格 主页 本节小结本节小结 本节小结本节小结 思考题思考题 框架框架 表格表格 主页 本节小结本节小结 本节小结本节小结 思考题思考题 框架框架 表格表格 主页 本节小结本节小结 本节小结本节小结 思考题思考题 框架框架 表格表格 主页 本节小结本节小结 本节小结本节小结 思考题思考题 框架框架 表格表格 主页 本节小结本节小结 本节小结本节小结 思考题思考题 框架框架 表格表格 主页

3、 本节小结本节小结 本节小结本节小结 思考题思考题 框架框架 表格表格 主页 本节小结本节小结 本节小结本节小结 思考题思考题 框架框架 表格表格 主页 本节小结本节小结 本节小结本节小结 思考题思考题 框架框架 表格表格 主页 本节小结本节小结 本节小结本节小结 思考题思考题 框架框架 表格表格 主页 本节小结本节小结 本节小结本节小结 思考题思考题 框架框架 表格表格 主页 本节小结本节小结 本节小结本节小结 思考题思考题 框架框架 表格表格 主页 本节小结本节小结 本节小结本节小结 思考题思考题 框架框架 表格表格 主页 选择基本上不传达信息的小选择基本上不传达信息的小 巧而精致的图像巧

4、而精致的图像 选择带有较少形状、模式或选择带有较少形状、模式或 颜色的简单图像颜色的简单图像 选择能够突出文档意图的选择能够突出文档意图的 图像图像 在尽可能多的浏览器中查看在尽可能多的浏览器中查看 带有表格背景图像的带有表格背景图像的HTMLHTML文文 档，确保跨浏览器的兼容性档，确保跨浏览器的兼容性 本节小结本节小结 本节小结本节小结 思考题思考题 框架框架 表格表格 主页 本节小结本节小结 本节小结本节小结 思考题思考题 框架框架 表格表格 主页 本节小结本节小结 本节小结本节小结 思考题思考题 框架框架 表格表格 主页 本节小结本节小结 本节小结本节小结 思考题思考题 框架框架 表格

5、表格 主页 本节小结本节小结 本节小结本节小结 思考题思考题 框架框架 表格表格 主页 本节小结本节小结 本节小结本节小结 思考题思考题 框架框架 表格表格 主页 本节小结本节小结 本节小结本节小结 思考题思考题 框架框架 表格表格 主页 本节小结本节小结 本节小结本节小结 思考题思考题 框架框架 表格表格 主页 本节小结本节小结 本节小结本节小结 思考题思考题 框架框架 表格表格 主页 本节小结本节小结 本节小结本节小结 思考题思考题 框架框架 表格表格 主页 本节小结本节小结 本节小结本节小结 思考题思考题 框架框架 表格表格 主页 框架概述框架概述 框架结构组成标记框架结构组成标记 框架

6、集标记框架集标记 框架标记框架标记 不支持框架标记不支持框架标记 浮动框架浮动框架 框架与链接框架与链接 本节小结本节小结 本节小结本节小结 思考题思考题 框架框架 表格表格 主页 HTML HTML 框架允许在浏览器中同时显框架允许在浏览器中同时显 示多个示多个HTMLHTML文档文档 多个页面能够同时在同一浏览器多个页面能够同时在同一浏览器 可独立滚动的窗口中显示可独立滚动的窗口中显示 用来把浏览器窗口分成几个独立用来把浏览器窗口分成几个独立 的部分的部分 每一部分可以分别包含一个单独每一部分可以分别包含一个单独 的的HTML HTML 文档文档 借助于框架分割浏览器窗口可以显借助于框架分

7、割浏览器窗口可以显 著改进外观和可用性著改进外观和可用性 本节小结本节小结 本节小结本节小结 思考题思考题 框架框架 表格表格 主页 可以水平或垂直分割可以水平或垂直分割 垂直框架具有垂直边框垂直框架具有垂直边框 水平框架具有水平边框水平框架具有水平边框 也可以在框架中嵌套框架也可以在框架中嵌套框架 在定义框架间的交互之前在定义框架间的交互之前 必须先设定布局必须先设定布局 本节小结本节小结 本节小结本节小结 思考题思考题 框架框架 表格表格 主页 使网页内容看起来更美观使网页内容看起来更美观 减少了网站的下载时间减少了网站的下载时间 提高了网站的可用性提高了网站的可用性 导航部分仍然可见，因

8、为内容在导航部分仍然可见，因为内容在 单独的框架中改变单独的框架中改变 框架允许开发者将内容与导航和框架允许开发者将内容与导航和 结构元素分离结构元素分离 有助于轻松、快速地更新内容有助于轻松、快速地更新内容 本节小结本节小结 本节小结本节小结 思考题思考题 框架框架 表格表格 主页 老版本的浏览器不支持框架老版本的浏览器不支持框架 开发者需要创建并组织多个文件来充开发者需要创建并组织多个文件来充 实页面，使站点创建更复杂实页面，使站点创建更复杂 框架结构的框架结构的Web Web 站点不允许访问者在站点不允许访问者在 一个框架结构的文档中为页面加入书一个框架结构的文档中为页面加入书 签签 框

9、架结构的框架结构的Web Web 站点会增加服务器负站点会增加服务器负 载，导致过多的文档请求载，导致过多的文档请求 框架结构的框架结构的Web Web 站点会使搜索引擎产站点会使搜索引擎产 生问题生问题 在框架结构的在框架结构的Web Web 站点中很难跟踪一站点中很难跟踪一 个页面个页面 本节小结本节小结 本节小结本节小结 思考题思考题 框架框架 表格表格 主页确定要创建的框架大小确定要创建的框架大小 创建框架集文档，确定各框架创建框架集文档，确定各框架 的位置和特性的位置和特性 指定框架和其中的内容指定框架和其中的内容 格式化框架格式化框架 预先为在非框架结构的浏览器预先为在非框架结构的

10、浏览器 中显示框架做好准备中显示框架做好准备 本节小结本节小结 本节小结本节小结 思考题思考题 框架框架 表格表格 主页 框架集标记框架集标记：主主 要是定义浏览器窗口的分割要是定义浏览器窗口的分割 方式，以及各分割窗口（框方式，以及各分割窗口（框 架）的大小架）的大小 框架标记框架标记：定义各定义各 分割窗口中显示的内容，并分割窗口中显示的内容，并 能对各分割窗口进行格式化能对各分割窗口进行格式化 本节小结本节小结 本节小结本节小结 思考题思考题 框架框架 表格表格 主页 框架分割窗口方式框架分割窗口方式： 左右（水平）分割左右（水平）分割 上下（垂直）分割上下（垂直）分割 嵌套分割：浏览器

11、窗口既嵌套分割：浏览器窗口既 存在左右分割，又存在上存在左右分割，又存在上 下分割下分割 本节小结本节小结 本节小结本节小结 思考题思考题 框架框架 表格表格 主页 基本语法基本语法 frameset . . 本节小结本节小结 本节小结本节小结 思考题思考题 框架框架 表格表格 主页 语法解释语法解释 colscols属性决定了窗口的分割方属性决定了窗口的分割方 式为左右分割；式为左右分割；“valuevalue”定义定义 各个框架的大小，单位可以是各个框架的大小，单位可以是 像素，也可以是百分比；像素，也可以是百分比；valuevalue 的个数决定了的个数决定了标记的个标记的个 数，即窗口

12、的个数，而数，即窗口的个数，而valuevalue的的 值则决定了相应窗口的大小值则决定了相应窗口的大小 本节小结本节小结 本节小结本节小结 思考题思考题 框架框架 表格表格 主页 本节小结本节小结 本节小结本节小结 思考题思考题 框架框架 表格表格 主页 基本语法基本语法: . 本节小结本节小结 本节小结本节小结 思考题思考题 框架框架 表格表格 主页 rowsrows属性决定了窗口的分割方式为属性决定了窗口的分割方式为 上下分割；上下分割；“valuevalue”定义各个框架定义各个框架 的大小，单位可以是像素，也可以的大小，单位可以是像素，也可以 是百分比；是百分比；valuevalue

13、的个数决定了的个数决定了 标记的个数，即窗口的个数，标记的个数，即窗口的个数， 而而valuevalue的值则决定了相应窗口的大的值则决定了相应窗口的大 小小 本节小结本节小结 本节小结本节小结 思考题思考题 框架框架 表格表格 主页 本节小结本节小结 本节小结本节小结 思考题思考题 框架框架 表格表格 主页 基本语法基本语法 . 本节小结本节小结 本节小结本节小结 思考题思考题 框架框架 表格表格 主页 本节小结本节小结 本节小结本节小结 思考题思考题 框架框架 表格表格 主页 本节小结本节小结 本节小结本节小结 思考题思考题 框架框架 表格表格 主页 本节小结本节小结 本节小结本节小结 思

14、考题思考题 框架框架 表格表格 主页 基本语法基本语法 frameset frame src=url frame src=url . . 本节小结本节小结 本节小结本节小结 思考题思考题 框架框架 表格表格 主页 语法解释语法解释 srcsrc属性用于设置在框架窗属性用于设置在框架窗 口中显示的内容来自的文件；口中显示的内容来自的文件； namename属性用于标记框架名称，属性用于标记框架名称， 以便于其他对象对它的引用，以便于其他对象对它的引用， 如作为链接的一个目标窗口如作为链接的一个目标窗口 本节小结本节小结 本节小结本节小结 思考题思考题 框架框架 表格表格 主页 本节小结本节小结

15、本节小结本节小结 思考题思考题 框架框架 表格表格 主页 本节小结本节小结 本节小结本节小结 思考题思考题 框架框架 表格表格 主页 框架属性说明框架属性说明 使用框架的属性，可设置框使用框架的属性，可设置框 架显示的内容以及对框架进架显示的内容以及对框架进 行格式化行格式化 对框架的格式化包括更改边对框架的格式化包括更改边 框、调整页边距和指定颜色框、调整页边距和指定颜色 以及由访问者对它的使用实以及由访问者对它的使用实 行控制行控制 本节小结本节小结 本节小结本节小结 思考题思考题 框架框架 表格表格 主页 框架综合示例框架综合示例 框架综合示例代码框架综合示例代码 本节小结本节小结 本节

16、小结本节小结 思考题思考题 框架框架 表格表格 主页 浮动框架是一种特殊的框架页浮动框架是一种特殊的框架页 面，其作为面，其作为HTMLHTML文档的文档的一部分一部分， 就象图像一样出现在就象图像一样出现在HTMLHTML文档文档 中。浮动框架允许将一个中。浮动框架允许将一个HTMLHTML 文档插入到另一个文档插入到另一个HTMLHTML文档内文档内 部的部的某个区域某个区域。 使用浮动框架时必须设置该框使用浮动框架时必须设置该框 架的大小，即框架的高度和宽架的大小，即框架的高度和宽 度度 本节小结本节小结 本节小结本节小结 思考题思考题 框架框架 表格表格 主页 基本语法基本语法 ifr

17、ameset 本节小结本节小结 本节小结本节小结 思考题思考题 框架框架 表格表格 主页 本节小结本节小结 本节小结本节小结 思考题思考题 框架框架 表格表格 主页 本节小结本节小结 本节小结本节小结 思考题思考题 框架框架 表格表格 主页 框架的一个重要目的是在框架的一个重要目的是在 不同的框架中显示不同的不同的框架中显示不同的 页面，通过链接目标窗口页面，通过链接目标窗口 的设置可实现这一目的的设置可实现这一目的 具体实现方法：将框架的具体实现方法：将框架的 框架名属性值作为超链接框架名属性值作为超链接 的的targettarget的属性值的属性值 本节小结本节小结 本节小结本节小结 思考

18、题思考题 框架框架 表格表格 主页 本节小结本节小结 本节小结本节小结 思考题思考题 框架框架 表格表格 主页 浮动框架与链接示例浮动框架与链接示例 本节小结本节小结 本节小结本节小结 思考题思考题 框架框架 表格表格 主页 框架的作用是将浏览器窗口分割成若框架的作用是将浏览器窗口分割成若 干个区域，每个区域可分别显示不同干个区域，每个区域可分别显示不同 的页面的页面 框架对浏览器窗口的分割方式有：左框架对浏览器窗口的分割方式有：左 右分割、上下分割和嵌套分割右分割、上下分割和嵌套分割 框架的组成标记有框架的组成标记有和和 使用框架结构时，使用框架结构时，HTMLHTML文档中不能出文档中不能出 现现。需需 要由要由代替代替 本节小结本节小结 本节小结本节小结 思考题思考题 框架框