电子商务网站开发 第十一讲：框架与框架集 上海财经大学信息管理与工程学院.

Presentation on theme: "电子商务网站开发 第十一讲：框架与框架集 上海财经大学信息管理与工程学院."— Presentation transcript:

1 电子商务网站开发 第十一讲：框架与框架集 上海财经大学信息管理与工程学院

2 本讲主要内容 框架和框架集介绍 创建框架和框架集 设置框架和框架集属性 在框架中使用超联接

3 11.1 框架与框架集介绍 框架集是一种特殊的HTML网页，可用来将浏览器窗口分割成不同的区域，每个区域称为一个框架（Frame），在每一个框架中可以显示一个不同的网页。 框架集网页中可以指定页面中包含多少个框架，设置每个框架的大小，位轩以及初始显示的网页等。框架集网页本身不包含网页内容，主要是为了把浏览器窗口划分为多个区域，并指定在每个区域中显示哪个网页。

4 11.2 创建框架和框架集 在Dreamwaver中可以一次创建框架集网页和每个框架内的初始网页，也可以预先创建好所有框架内的网页，再创建框架集网页。 创建框架与框架集有两种方法： 自定义 选择预定义的框架集

5 (1) 创建一个预定义的框架集 选择“文件新建”菜单 在“新建文档”对话框的“类别”列表框中选择“框架集”
在“框架集”列表中选择一个预定义的框架集（如“上方固定，左侧嵌套”） 按“创建”按钮，则创建一个空白框架集网页

6 (2) 编辑框架集 可以对框架调整大小、分割一个框架或删除一个框架。
这些操作一般要通过框架边框来完成，所以若框架边框未显示，应先把框架边框显示出来。 显示框架边框：选择“查看可视化助理框架边框”菜单 调整框架大小的步骤是用鼠标拖动框架的边框 分割框架的步骤是把光标停在要分割的框架中，在“修改框架集”菜单中选择一个分割方式菜单项（把当前框架分割到左面、右面、上面或下面） 删除框架的步骤是用鼠标拖动框架的边框到相邻的边框上放下。

7 (3) 保存框架集 框架集网页对应一个文件，每个框架也分别对应一个文件。 保存框架内的网页： 保存框架集： 保存所有文件：
把光标停在要保存的框架中 选择“文件保存框架”菜单 保存框架集： 选择框架集（参见下一节中相应内容） 选择“文件保存框架集”菜单 输入文件名 保存所有文件： 选择“文件保存所有文件” 对每个框架和整个框架集都会显示一个“保存”对话框

8 Name: TopFrame File: head.html Name: LeftFrame File: nav.html Name: MainFrame File: home.html 或news.html 或projects.html 等等 Name: bottomFrame File: Copyright.html 框架集 Index.html

9 10.3 设置框架和框架集属性 选择框架集 设置框架和框架集属性 在文档窗口中选择 选择框架：按住Alt键，单击待选择的框架内部
在“框架”面板中选择框架和框架集 打开面板：窗口其他框架 选择框架：在面板中单击框架 选择框架集：在面析中单击框架集 设置框架和框架集属性 框架属性：名称、源文件、滚动、不能调整大小、边框、边框颜色、边距宽度、边距高度 框架集属性：边框、边框颜色、边框宽度

10 10.4 在框架中使用超链接 在一个框架中使用超链接以打开另一个框架中的文档，则必须设置超链接目标（target）。
超链接的target属性指定超链接的内容在哪个框架或窗口中打开（target等于目标框架的名称）。 如果没有设置超链接的target属性，则超链接的内容将显示在该超链接所在的框架内。 Target属性可以指定为一个框架的名称，也可以指定为以下四个预定义的值之一 _blank：在新窗口中打开链接的文档 _parent：在显示链接的框架的父框架集中打开链接的文档，同时替换整个框架集 _self：在当前框架中打开链接，同时替换该框架中的内容 _top：在当前浏览器窗口中打开链接的文档，同时替换所有框架