网页制作 第九章使用框架

除了前面两种选取方法外，还可以在选 取一个框架的基础上用快捷键选取其他框架， 其方法为：按住【Alt】键再按键盘上的左右 方向键即可选取同级框架或框架集；按住 【Alt】键再按键盘上的向上方向键可以从文 档编辑状态、框架、框架集逐步扩大范围选 取，即升级选取，反之按向下方向键就是降 级选取。
图9-17
图9-3
图9-4
如果单击 按钮，该框架集将出 现在文档中，但Dreamweaver不会将它与 辅助功能标签或属性相关联。另外，默 认情况下，Dreamweaver不会显示“框架 标签辅助功能属性”对话框，除非在 “首选参数”中进行了相应的设置，设 置方法如下。 （1）选择[编辑][首选参数]菜单命 令，打开“首选参数”对话框。
创建框架及框架集
在Dreamweaver中有两种创建框架集的方法，既 可以从若干预定义的框架集中选择，也可以自己设 计框架集。 选择预定义的框架集将自动设置创建布局所需 的所有框架集和框架，它是迅速创建基于框架的布 局的最简单方法。只能在“文档”窗口的“设计” 视图中插入预定义的框架集。

保存框架集文档
保存框架集文档的具体操作如下。 （1）选中要保存的框架集。 （2）选择[文件][保存框架页]菜单命令， 打开“另存为”对话框。 （3）在“保存在”下拉列表框中指定框架集 的保存路径，在“文件名”文本框中为框架集命 名。 （4）单击 按钮即可保存框架集。
第9章
课前导读 课堂讲解 上机实战 课后练习
使用框架
课前导读
基础知识 重点知识

基础知识
框架及框架集的概念、 框架及框架集的创建。
重点知识
框架及框架集的属 性设置、框架及框架集 的各种操作。
课堂讲解
创建框架集及框架 框架集与框架的选择及删除操作 框架及框架集的属性设置 框架及框架集的保存 处理不能显示框架的浏览器
框架集的属性设置
使用框架集属性面板可以查看和设置大 多数框架集属性。其具体操作如下。
（1）用上述选择框架集的方法选择要 设置属性的框架集并打开“框架集”属性面 板，如图9-21所示。
图9-21
（2）在“框架集”属性面板中按需要进行 更改。各参数功能如下。



边框：确定在浏览器中查看文档时在框架周围是否应显 示边框。要显示边框，则选择“是”；要使浏览器不显 示边框，则选择“否”；要允许浏览器确定如何显示边 框，则选择“默认值”。 边框宽度：指定框架集中所有边框的宽度。 边框颜色：设置边框的颜色。使用颜色选择器选择一种 颜色，或者输入颜色的十六进制值。 若要设置选定框架集的各行和各列的框架大小，可单击 “行列选择范围”区域左侧或顶部的选项卡，然后在 “值”数值框中输入高度或宽度。
（3）设置完成每一项参数设置后可按 【Enter】键进行应用。
框架集文档标题的设置
（1）用上述选择框架集的方法选择要设置框 架集文档的标题的框架集。 （2）在“文档”工具栏的“标题”文本框中 输入框架集文档的名称即可，如图9-22所示。 当访问者在浏览器中查看该框架集时，标题 将显示在浏览器的标题栏中。 图9-22
插入预定义的框架集 创建新的空预定义框架集 将现有文档分割为框架
插入预定义的框架集
通过预定义的框架集，可以很容易地选 择要创建的框架集类型。创建预定义的框架 集有两种方法：

通过“插入”栏可以创建框架集并在某一个新的框架 中显示当前文档； 通过“新建文档”对话框可以创建新的空框架集。
要创建预定义的框架集并在某一框架中显 示现有文档，可执行如下操作。 （1）将插入点放置在文档中。 （2）执行下列操作之一。
（3）在“滚动”下拉列表中设置框架出现 滚动条的方式，如图9-24所示。 （4）选中 复选框则不能在浏览器中通过拖 动框架边框来改变框架大小。如果清除该复选 框，则可以通过拖动框架的边框来改变其大小。
图9-24
（5）在“边框”下拉列表框中可设置是否显示框架 的边框。如在下拉列表框中选择了“是”或“否”选项 则覆盖系统定义的框架集边框。 （6）在“边框颜色”文本框中设置框架边框的颜色 代码，或从色块中选择需要的框架边框颜色。若设置了 该项则会覆盖框架集中预定义的边框颜色。 （7）在“边界宽度”数值框中输入当前框架中的内 容距左右边框间的距离。 （8）在“边界高度”数值框中输入当前框架中的内 容距上下边框间的距离。
如图9-1所示的示例显示了一个由3个框 架组成的框架布局：一个较窄的框架位于侧 面，包含导航条；一个框架横放在顶部，其 中包含Web站点的LOGO和标题；一个大框架 占据了页面的其余部分，其中包含主要内容。 这些框架中的每一个都可显示单独的Web文 档。 在网页实际制作过程中，一般顶端和左 侧的内容不变，只有右侧的内容会在不同的 页面中变化。当浏览者单击左侧框架中的链 接时，右侧框架中就会显示相应的Web页面 内容。
图9-13
图9-14
选取框架和框架集
框架和框架集的选取有以下两种方法。


在文档窗口中直接选取； 在“框架”面板中选择框架或框架集。
在文档窗口选择
在文档窗口选择框架的方法很简单， 其方法为：按住【Alt】键在要选取的框 架内单击鼠标左键即可。被选取的框架 边框有虚线，如图9-15所示即为选择了 右侧框架后的效果。 选择框架集时，单击要选取的框架 边框即可，选取的所有框架边框呈现虚 线，如图9-16所示。
图9-18
删除框架
如果窗口中有不需要的框架，可将其删除，其 方法为：用鼠标将要删除框架的边框拖到父框架边 框上或拖离页面即可。如图9-19所示为拖离前，如 图9-20所示为拖离后的效果。
图9-19
图9-20
框架及框架集的属性设置
框架集的属性设置 框架集文档标题的设置 框架的属性设置

在Dream weaver MX 2004中，可以使用“框 架”属性面板来定义框架的名称、源文件、页边 距等属性。使用“框架集”属性面板可以定义框 架集边线颜色、宽度等属性。
要设置框架集文档的标题，可执行如下操作。
框架的属性设置
选中要设置属性的框架，框架属性面板如图9-23所 示。
图9-23
设置框架属性的具体操作如下。 （1）在“框架名称”文本框中可给选取的 框架命名。设置的框架名称可以被JavaScript 程序引用，也可以作为打开链接的目标框架名。 框架名只能是字母、下划线符号等组成的 字符串，但必须以字母开头。不能出现连字号、 句点及空格。不能使用JavaScript的保留关键 字，如top或navigator等。 （2）在“源文件”文本框中显示框架源文 件的URL地址，也可单击 按钮重新指定框架源 文件的地址。
（3）在左框架中单击鼠标，再拖动文档 窗口上边的边框，则可创建出如图9-9所示的 框架。 （4）按住【Alt】键，在如图9-8所示的 右框架中单击，再拖动文档窗口上边的边框， 则可创建出如图9-10所示的新框架 （5）将鼠标指向如图9-7所示窗口的左上 角，当光标变为形状时（如图9-11所示）， 按住鼠标不放向右下角拖动可创建如图9-12 所示的新框架。
图9-15
图9-16
在“框架”面板中选择
在框架面板中选择框架的方法为：直接 在面板中单击要选择的框架区域中的任意 位置，选中的框架以粗黑框显示，如图917所示。 选取框架集的方法为：在“框架”面 板中单击包含要选取的框架集的边框即可， 如选择整个框架集，只需单击框架最外面 的边框即可，如图9-1框架
其具体操作如下。 （1）新建一个空白的HTML文档后，选择 [查看][可视化助理][框架边框]菜单命令， 即可在当前文档中显示出框架的边框，如图 9-7所示。 （2）拖动文档窗口四周的边框即可创建新 框架，在如图9-7所示的窗口中通过拖动文档 窗口的左边框创建出如图9-8所示的新框架。
图9-1
框架不是文件。很可能 会以为当前显示在框架中的 文档是构成框架的一部分， 但该文档实际上并不是框架 的一部分。框架是存放文档 的容器，任何一个框架都可 以显示任意一个文档。
如果一个站点在浏览器中显示为包含3个框 架的单个页面，则它实际上至少由4个单独的 Web文档组成：框架集文件以及3个文档，这3个 文档包含这些框架内初始显示的内容。当在 Dreamweaver中设计使用框架集的页面时，必须 全部保存这4个文件，以便该页面可以在浏览器 中正常工作。

若要指定浏览器分配给每个框架的空间大小，从“单位” 下拉列表中选择以下选项。
» 像素：将选定列或行的大小设置为一个绝对值。对于应始终保持 相同大小的框架（例如导航条）而言，此选项是最佳选择。 » 百分比：指定选定列或行应相当于其框架集的总宽度或总高度的 百分比。

相对：指定在为“像素”和“百分比”框架分配空 间后，为选定列或行分配其余可用空间；剩余空间在大 小设置为“相对”的框架中按比例划分。
（2）在对话框左侧的“分类”列表中选择 “辅助功能”选项，然后在右侧的“在插入时 显示辅助功能属性”栏中选中 复选框，如 图9-5所示。 （3）单击 按钮保存设置即可。
图9-5
创建新的空预定义框架集
创建新的空预定义框架集的具体操作如下。 （1）选择[文件][新建]菜单命令。 （2）在“新建文档”对话框“类别”列表 中选择“框架集”选项。 （3）从“框架集”列表选择相应的框架集， 如图9-6所示。 （4）单击 按钮。则框架集出现在文 档中，效果如图9-4所示。

层的创建
了解框架及框架集 创建框架及框架集

框架的功能是把浏览器窗口划分为若干个区域，分别 显示不同的网页。框架集的功能是定义一组框架的布局和 属性。下面对框架及框架集的相关知识进行介绍。
了解框架及框架集
框架是浏览器窗口中的一个区域，在框架中可 以显示其他的网页。 框架集是HTML文件，它定义一组框架的布局和 属性，包括框架的数目、框架的大小和位置以及在 每个框架中初始显示的页面地址。框架集文件本身 不包含要在浏览器中显示的Web页内容（对不能显 示框架的浏览器进行的处理除外，即<noframes>部 分）。框架集文件只是向浏览器提供应如何显示一 组框架以及在这些框架中应显示哪些文档的有关信 息。