网页设计与制作 教学课件 作者 李广武张逸昀梁平 主编 第8章_框架.pptVIP

尚辅网 尚辅网 尚辅网 第8章 框架 尚辅网 第8章 框架 8.1 框架的规划与建立 8.2 框架的操作 8.3 在框架中插入页面 8.4 设置框架属性 8.5 框架应用示例 8.6 本章小结 框架是网页制作过程中必不可少的一种实用Web技术。因为它的功能强大、效果特殊并且使用方便，所以深受广大网页设计人员的喜爱。如果你留神一点将发现，网上的大部分站点都用到了框架结构。 尚辅网 8.1.1 规划框架 使用框架具有以下优点： 访问者的浏览器不需要为每个页面重新加载与导航相关的图形。 每个框架都具有自己的滚动条（如果内容太大，在窗口中显示不下），因此访问者可以独立滚动这些框架。（例如，当框架中的内容页面较长时，如果导航条位于不同的框架中，那么向下滚动到页面底部的访问者就不需要再将滚动条回顶部来使用导航条。） 8.1 框架的规划与建立 尚辅网 1．要创建预定义的框架集并在某一框架中显示现有文档，请执行以下操作 （1）把光标定位在文档中。 （2）执行下列操作之一： 选择【插入】|【HTML】|【框架】子菜单中选择预定义的框架集，如图8-1所示。 选择“插入”面板上的“布局”选项卡，单击框架按钮上的下拉箭头 ，然后选择预定义的框架集，如图所示。 8.1.2 创建框架 8.1 框架的规划与建立 尚辅网 （3）如果已将 Dreamweaver 设置为提示你输入框架辅助功能属性，那么将会出现“框架标签辅助功能属性”对话框。 如果出现“框架标签辅助功能属性”对话框，请为每个框架完成此对话框，然后单击“确定”。 2．要创建新的空预定义框架集，请执行以下操作 （1）选择【文件】|【新建】。 （2）在“新建文档”对话框中，选择“示例中的页”中的“框架页”类别。如图所示。 （3）从“框架页”列表选择框架集。 （4）单击“创建”按钮。 8.1.2 创建框架 8.1 框架的规划与建立 尚辅网 下面我们来看一个在页面中添加框架的示例，具体步骤如下： （1）把光标定位在文档中。 （2）选择 “插入”面板上的“布局”选项卡，单击“框架”按钮上的下拉箭头，然后选择预定义的框架集，如左图所示。选择“顶部和嵌套的左侧框架”，创建如右图所示的框架。 8.1.3 在页面中添加框架示例 8.1 框架的规划与建立 尚辅网 在Dreamweaver中，预先设计的13种框架集的尺寸都是规定好的，你如果要调整框架的大小，请执行以下操作之一： 如果要设置框架的粗略大小，在“文档”窗口的“设计”视图中将光标放在两个框架间的边框上，光标指针将变成双箭头，拖动边框到新位置，然后释放鼠标键。 如果要指定准确大小，并指定当浏览器窗口大小不允许框架以全大小显示时，浏览器分配给框架的行或列的大小，可使用“属性检查器”（请参见8.4节设置框架属性）。 8.2.1 改变框架尺寸 8.2 框架的操作 尚辅网 8.2.2 嵌套框架 8.2 框架的操作 尚辅网 如果你要将一个框架拆分成几个更小的框架，请执行以下操作： 如果你要拆分插入点所在的框架，从【修改】|【框架集】子菜单选择拆分项，如图所示。 如果你要以垂直或水平方式拆分一个框架或一组框架，请将框架边框从“设计”视图的边缘拖入“设计”视图的中间。 如果你要使用不在“设计”视图边缘的框架边框拆分一个框架，请在按住 Alt 键的同时拖动框架边框。 如果你要将一个框架拆分成四个框架，请将框架边框从“设计”视图一角拖入框架的中间。 8.2.3 拆分框架 8.2 框架的操作 尚辅网 增加新框架的具体操作步骤如下： （1）把光标定位在文档中。 （2）选择 “插入”面板上的“布局”选项卡，单击“框架”按钮上的下拉箭头，然后选择预定义的框架集。例如选择“顶部和嵌套的左侧框架”，创建如图8-4所示的框架。 （3）例如想要拆分图所示的框架的上框架，则将光标定位在上框架中，选择【修改】|【框架集】|【拆分左框架】菜单选项，效果如图示。 8.2.4 增加、删除框架 8.2 框架的操作 尚辅网 1．如果你要保存框架集文件，请执行以下操作 （1）在“框架”面板或“文档”窗口中选择框架集。 （2）执行下列操作之一： 若要保存框架集文件，请选择【文件】|【保存框架集】菜单命令（其快捷键为【Ctrl+S】）。如图所示。 若要将框架集文件另存为新文件，请选择【文件】|【框架集另存为】菜单命令。 8.2.5 保存框架 8.2 框架的操作 尚辅网 8.2 框架的操作 8.2.5 保存框架 2．如果你要保存框架中显示的文档，请执行以下操作 在框架中单击，然后选择【文件】|【保存框架】菜单命令（其快捷键为【Ctrl+S】），如图