第8章 使用框架

框架能够将页面分割成几个不同的独立窗口，在每个窗口内显示不同的文档。在网页制作中，特别是论坛的制作中，有时会用到框架技术。本章将介绍在DreamweaverCS3中创建和设置框架的基本方法。第8章使用框架学习目标掌握创建框架的方法。掌握保存框架的方法。掌握选定框架的方法。掌握设置框架和框架集属性的方法。掌握设置框架中链接目标窗口的方法。8.1创建框架创建框架页保存框架8.1.1创建框架页

在DreamweaverCS3中创建和编辑框架页的方法如下。选择【文件】/【新建】命令，打开【新建文档】对话框，切换到【示例中的页】选项卡，在【示例文件夹】列表中选择【框架集】选项，在右侧的【示例页】列表中选择相应的选项。在欢迎屏幕中，选择【从模板创建】/【框架集】命令。在当前网页中，单击【插入】/【布局】工具栏中（框架）按钮的（向下箭头），在弹出的下拉按钮组中单击相应的按钮。选择【修改】／【框架集】/【拆分左框架】或【拆分右框架】、【拆分上框架】、【拆分下框架】命令来拆分框架。在当前网页中，选择菜单栏中的【插入记录】/【HTML】/【框架】中的相应命令。8.1.1创建框架页选择【文件】／【新建】命令，打开【新建文档】对话框并切换到【示例中的页】选项卡，然后在【示例文件夹】列表中选择【框架集】选项，在右侧的【示例页】列表中选择【上方固定，左侧嵌套】选项8.1.1创建框架页将光标置于右下方的框架内，在【插入】/【布局】工具栏的框架按钮组中单击

按钮再插入一个框架窗口。8.1.2保存框架选择【文件】/【保存全部】命令将依次保存框架集内的所有文件，包括框架集文件和框架文件在需要保存的框架内单击，然后选择【文件】/【保存框架】命令可以对单个框架文件进行保存选择【文件】/【框架另存为】命令可以给框架文件改名；如果要将框架保存为模板，可以选择【文件】/【框架另存为模板】命令在【框架】面板或【设计】视图窗口中选择框架集，然后选择【文件】/【保存框架】命令或【文件】/【框架集另存为】命令可以保存框架集文件8.1.2保存框架选择【文件】／【保存全部】命令打开【另存为】对话框

。此时将在整个框架边框的内侧出现一个阴影框，这意味着首先要求保存的是整个框架集。接着出现第2个【另存为】对话框要求保存第2个框架，直至所有的框架全部命名保存为止。8.1.2保存框架将光标置于顶部框架内，选择【文件】/【在框架中打开】命令打开文档“top.htm”，然后依次在左侧、中间和右侧的框架内打开文档“menu.htm”、“main.htm”、“list.htm”。8.2设置框架选定框架框架属性设置框架8.2.1选定框架一、在【框架】面板中选择框架和框架集选择【窗口】／【框架】命令，打开【框架】面板。在【框架】面板中，直接单击相应的框架即可选择该框架，单击框架集的边框即可选择该框架集。被选择的框架和框架集，其周围出现黑色细线框。8.2.1选择框架二、在编辑窗口中选择框架和框架集按住Alt键不放，在相应的框架内单击鼠标左健即可选择该框架，被选择的框架边框将显示为虚线。单击相应的框架集边框即可选择该框架集，被选择的框架集边框也将显示为虚线。8.2.2框架属性当选定框架时，在【属性】面板中将显示其相应的属性。当选定框架集时，在【属性】面板中将显示其相应的属性。8.2.3

设置框架步骤参考教材。8.3

浮动框架浮动框架是一种较为特殊的框架形式，可以包含在许多元素当中，例如层、单元格等。选择【插入记录】/【标签】命令，打开【标签选择器】对话框，然后展开【HTML标签】分类，在右侧列表中找到“iframe”。单击【插入】按钮打开【标签编辑器－iframe】对话框进行设置。8.3

浮动框架浮动框架中包含的文档通过定制的浮动框架显示出来，可通过拖曳滚动条来滚动显示，虽然显示区域有所限制，但能灵活地显示位置及尺寸的优点，使浮动框架具有不可替代的作用。8.4

设置框架中超级链接的目标在顶部框架中选中文本“会议”，并为其添加空链接“#”。

在【属性】面板的【目标】下拉列表中选择“mainFrame”。在【目标】下拉列表中选择哪一个框架名称，当单击相应的超级链接时哪一个框架的内容就会改变。但1次只能选择1个目标，还有一种方法可以同时改变多个框架中的内容。选中链接文本“通知”，然后打开【行为】面板，单击按钮在弹出的下拉菜单中选择【转到URL】命令，打开【转到URL】对话框。在【打开在】列表框中每选中一个框架名称，就可在【URL】文本框中为其设置所指向