网页设计与制作教程第2版北京市精品教材课件作者赵丰年吕宜宏第9章节使用框架.pptVIP

第9章 使用框架 本章要点 9.1 框架概述 9.2 框架布局实例 9.1 框架概述 本节介绍框架基础知识及 Dreamweaver 框架基本操作。主要内容： 什么是框架 框架的基本操作 9.1.1 什么是框架 框架是在浏览器窗口中显示多个文件的网页技术。所谓框架结构，就是指用框架将浏览器窗口分割成若干区域，然后在各个区域分别指定一个网页文件。 框架最常见用途就是导航。一组框架通常包括一个含有导航条的框架和另一个要显示主要内容页面的框架。但是，框架的设计可能比较复杂，并且在许多情况下，用户可以创建没有框架的网页，它也可以达到使用框架所能达到的许多相同效果。 9.1.1 什么是框架 （续） 框架网页的缺点： 难以实现不同框架中各元素图形的精确对齐 导航测试很耗时间 各个带有框架页面的 URL 不显示在浏览器窗口，访问者难以将特定页面设为书签 9.1.1 什么是框架 （续） 框架网页的优势： 访问浏览器不需要为每个页面重新加载内容 每个框架都具有自己的滚动条，访问者可以独立滚动这些框架 方便灵活的导航方式 9.1.1 什么是框架 （续） 图 9.1 就是一个使用框架结构布局的网页，当单击左边导航条中的按钮时，在右边框架中将显示出相应网页内容。 9.1.2 框架的基本操作 在 Dreamweaver 文档窗口中，框架操作内容包括： 创建框架结构 选取框架集与框架 设置框架集和框架的属性 保存框架 设置超链接目标框架 9.1.2 框架的基本操作（续） 创建框架结构 在 Dreamweaver 中创建框架结构，通常有两种方法： 利用“插入栏”的“布局”类别中的框架按钮 使用“新建文档”对话框 示例中的页 “框架集”选项，新建框架结构网页文档 9.1.2 框架的基本操作（续） 创建框架结构 演示——使用插入栏按钮创建框架（p180~p181） 演示——使用新建命令创建框架 （p182） 9.1.2 框架的基本操作（续） 框架结构实际上由两部分构成：一部分是定义整个窗口应如何划分的框架集（对应的 HTML 标签是frameset），另一部分是用于放置网页的每个具体框架（对应的 HTML 标签是frame）。 要操作框架首先要选择框架集或框架。 9.1.2 框架的基本操作（续） 选择框架集 在文档窗口中单击框架集四周的框线 在框架面板中单击要选择的框架集 选择框架 在文档窗口中，按住【Alt】不放，在框架中单击，可以选择框架 在框架面板中单击要选择框架的内部 9.1.2 框架的基本操作（续） 设置框架集的属性 选取框架集后，框架集属性检查器如图 9.6 所示，可以在其中设置框架集的属性。 9.1.2 框架的基本操作（续） 设置框架的属性 选取框架后，框架属性检查器如图 9.7 所示，可以在其中设置框架的属性。 9.1.2 框架的基本操作（续） 保存框架文件 使用保存全部命令对框架进行保存操作。 在保存框架时，如果有 n 个框架，则会弹出 n + 1 个“保存为”对话框，在对框架网页进行保存时，应该将所有框架文件保存到同一个目录下。 9.1.2 框架的基本操作（续） 设置目标框架 所谓超链接目标框架，是指框架结构网页中超链接的目标，即当单击超链接时，超链接的目标网页文件在哪个框架中显示。 例如，对于一般的左窄右宽的列式框架结构，总是在左边框架的网页中包含一些超链接，而在右边的框架中显示这些超链接的目标网页文件。 9.1.2 框架的基本操作（续） 设置目标框架 理解链接属性检查器“目标”选项的含义如图所示。 9.1.2 框架的基本操作（续） “目标”列表包含当前网页中的框架名称和默认超链接目标名称，含义如下： _blank 打开一个新窗口显示超链接目标文件 _parent 在上一级框架中打开目标文件，即在父框架中打开网页 _self 在框架自身内打开目标网页 _top 删除所有框架，回到最顶层打开链接目标文件，如果想从框架结构中跳出，应使用此选项 mainFrame 当前框架集中包含的框架名称 leftFrame 当前框架集中包含的框架名称 9.2 框架布局实例 演示——框架布局实例（p185~p192） 尚辅网 / *