网页设计与制作 教学课件 王学军 第8章 使用框架.pptVIP

框架能够将页面分割成几个不同的独立窗口，在每个窗口内显示不同的文档。在网页制作中，特别是论坛的制作中，有时会用到框架技术。本章将介绍在Dreamweaver CS3中创建和设置框架的基本方法。 * 第8章　使用框架 学习目标 掌握创建框架的方法。 掌握保存框架的方法。 掌握选定框架的方法。 掌握设置框架和框架集属性的方法。 掌握设置框架中链接目标窗口的方法。 8.1 创建框架 创建框架页 保存框架 8.1.1 创建框架页 　　　在Dreamweaver CS3中创建和编辑框架页的方法如下。 选择【文件】/【新建】命令，打开【新建文档】对话框，切换到【示例中的页】选项卡，在【示例文件夹】列表中选择【框架集】选项，在右侧的【示例页】列表中选择相应的选项。 在欢迎屏幕中，选择【从模板创建】/【框架集】命令。 在当前网页中，单击【插入】/【布局】工具栏中 （框架）按钮的 （向下箭头），在弹出的下拉按钮组中单击相应的按钮。 选择【修改】／【框架集】/【拆分左框架】或【拆分右框架】、【拆分上框架】、【拆分下框架】命令来拆分框架。 在当前网页中，选择菜单栏中的【插入记录】/【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】对话框进行设置。 *