《制作框架网》word版

《《制作框架网》word版》由会员上传分享，免费在线阅读，更多相关内容在工程资料-天天文库。

1、第八章制作框架网页框架是在同一个浏览窗口中显示多个网页的技术，框架网页是一种特殊的网页。框架将窗口划分为不同的部分，各部分中都有各自的网页，总体构架出一个框架集。此外，通过为超链接指定目标框架，可以在框架之间建立起以内容为媒介的联系，因而实现页面导航的功能。本章主要介绍如何使用Dreamweaver建立框架网页的方法。通过本章的学习，读者应该掌握以下内容：·认识框架技术和框架网页·创建框架网页的方法·编辑框架网页的方法·设置框架网页的属性·创建框架页的链接8.1认识框架网页框架(Frames)技术由框架集(Frameset)和框架(Frame)两部分组成

2、。框架集顾名思义就是框架的集合，它定义了各框架的结构、数量、大小尺寸及装入框架中的页面文件名和路径等有关框架的属性，框架集并不在浏览器中显示，只是存储所属框架的有关信息，框架集中的全部框架文件构成一个网页页面。框架则是框架集的组成元素，框架的页面是整个网页页面的一部分，是一个矩形区域，它具有网页所有的属性和功能，与框架集中其他框架页面的关系是平等的。框架网页是一种特殊的HTML网页，它可以将浏览器窗口分成不同的区域，称为框架区域，每个区域都可以保存并显示一个不同的网页。在如图8-1所示的“天使部落”中的“理想篇”网页就是利用框架网页设计的，在该网页中包含

3、有4个子框架网页。8.2创建框架DreamweaverMX创建框架集的方法有两种：一是可以自己设计，二是可以从几个预设的框架集中选择。从DreamweaverMX所提供的框架集中选择一个自己需要的框架集和框架来创建布局网页，这是最简便的布局网页的方法。8.2.1插入预设的框架集首先启动DreamweaverMX打开一个空白网页文档，然后执行下列操作之一可以创建新的框架集。·执行主菜单中的“插入”→“框架”命令，从弹出的子菜单中选择任意一个选项。·执行主菜单中的“修改”→“框架页”命令，从弹出的子菜单中选择任意一个选项。·执行主菜单中的“查看”→“可视化助

4、理”→“框架边框”命令，得到一个只有边框的框架网页。·执行主菜单中的“窗口”→“插入”命令，调出“插入”面板，单击其中的“框架”标签，打开预设框架集的“框架”面板，如图8-2所示，可以从中选择任意一项。图8-2“框架”面板提示：在“框架”面板中，预设的框架集是由两种颜色组成的，其中浅蓝色的区域表示在创建框架后，原文档内容所在的位置。白色区域则表示新创建的框架文档所在的位置。8.2.2设计和插入框架集“框架”面板上的预设框架集几乎包含了一般的框架格式，当然也可以自己设计框架格式，灵活运用框架集。下面是设计和插入框架集的方法和步骤。(1)在“框架”面板上单击

5、一种框架式样图标(共有13种)，如图8-3所示。(2)通过鼠标直接拖动内部边框，可以调整框架页面的大小。(3)利用鼠标拖动水平和垂直外边框，可以分割框架页面。按住Alt键后拖动内部边框，可以拆分内部框架页面，如图8-4所示。图8-3“使用框架”面板插入框架图8-4拖动框架内框分割页面8.3编辑框架本节将介绍框架和框架集的基本操作，包括如何选定框架与框架集、如何保存框架与框架集，以及在框架中打开网页文档的方法。8.3.1选定框架和框架集在对框架进行编辑操作之前必须先选择所需的框架，可以直接在网页文档视窗中选择框架，当然利用“框架”控制面板对框架进行操作比较

6、方便。1.利用框架控制面板选定框架和框架集(1)执行主菜单中的“窗口”→“其他”→“框架”命令(或按Shift+F2键)，打开“高级布局”面板的“框架”控制面板，如图8-5所示。图8-5“高级布局”的“框架”控制面板(2)在“框架”控制面板中出现的就是当前页面中的框架结构，如果要选定框架，使用鼠标直接单击“框架”控制面板中对应的框架即可，与此同时，在网页文档中被选定的相应框架四周边框以虚线显示。如果要选定当前网页文档中的所有框架，则利用鼠标单击“框架”控制面板周围的框架边框即可。如图8-6所示。图8-6在“框架”控制面板中选定框架和框架集2.在文档视窗中

7、选定框架和框架集如果要选定一个框架，则需要在按住Alt键的同时单击框架内的任意位置。如果要选定整个框架集，只需单击任何一个框架边框即可。当一个框架被选定后，它的边框会显现成虚线；当选定框架集后，框架集中的所有框架边框都会以虚线框显示，如图8-7所示。图8-7在网页文档窗口中选定框架和框架集3.切换所选定框架和框架集要在选定的框架之间进行切换，可以执行如下的操作之一。·若在相邻的框架之间进行切换，可按住Alt键的同时按下键盘上的右移箭头→或左移箭头←。·若要切换到父框架集，可按住Alt键的同时按下键盘上的上移箭头↑。·若要切换到子框架，可按住Alt键的同时

8、按下键盘上的下移箭头↓。8.3.2删除框架对于不需要的框架进行删除，方法很简单，