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

《网页设计与制作 教学课件 作者 李广武 张逸昀 梁平 主编第8章_框架.ppt》由会员上传分享，免费在线阅读，更多相关内容在教育资源-天天文库。

1、第8章框架第8章框架8.1框架的规划与建立8.2框架的操作8.3在框架中插入页面8.4设置框架属性8.5框架应用示例8.6本章小结框架是网页制作过程中必不可少的一种实用Web技术。因为它的功能强大、效果特殊并且使用方便，所以深受广大网页设计人员的喜爱。如果你留神一点将发现，网上的大部分站点都用到了框架结构。8.1.1规划框架使用框架具有以下优点：访问者的浏览器不需要为每个页面重新加载与导航相关的图形。每个框架都具有自己的滚动条（如果内容太大，在窗口中显示不下），因此访问者可以独立滚动这些框架。（例如，当框架中的内容页面较长时，如果导航条位于不同的框架中，那么向下滚动到页面底部的访问者就

2、不需要再将滚动条回顶部来使用导航条。）8.1框架的规划与建立1．要创建预定义的框架集并在某一框架中显示现有文档，请执行以下操作（1）把光标定位在文档中。（2）执行下列操作之一：选择【插入】

3、【HTML】

4、【框架】子菜单中选择预定义的框架集，如图8-1所示。选择“插入”面板上的“布局”选项卡，单击框架按钮上的下拉箭头，然后选择预定义的框架集，如图所示。8.1.2创建框架8.1框架的规划与建立（3）如果已将Dreamweaver设置为提示你输入框架辅助功能属性，那么将会出现“框架标签辅助功能属性”对话框。如果出现“框架标签辅助功能属性”对话框，请为每个框架完成此对话框，然后单击“确定”。2

5、．要创建新的空预定义框架集，请执行以下操作（1）选择【文件】

6、【新建】。（2）在“新建文档”对话框中，选择“示例中的页”中的“框架页”类别。如图所示。（3）从“框架页”列表选择框架集。（4）单击“创建”按钮。8.1.2创建框架8.1框架的规划与建立下面我们来看一个在页面中添加框架的示例，具体步骤如下：（1）把光标定位在文档中。（2）选择“插入”面板上的“布局”选项卡，单击“框架”按钮上的下拉箭头，然后选择预定义的框架集，如左图所示。选择“顶部和嵌套的左侧框架”，创建如右图所示的框架。8.1.3在页面中添加框架示例8.1框架的规划与建立在Dreamweaver中，预先设计的13种框架集的

7、尺寸都是规定好的，你如果要调整框架的大小，请执行以下操作之一：如果要设置框架的粗略大小，在“文档”窗口的“设计”视图中将光标放在两个框架间的边框上，光标指针将变成双箭头，拖动边框到新位置，然后释放鼠标键。如果要指定准确大小，并指定当浏览器窗口大小不允许框架以全大小显示时，浏览器分配给框架的行或列的大小，可使用“属性检查器”（请参见8.4节设置框架属性）。8.2.1改变框架尺寸8.2框架的操作8.2.2嵌套框架8.2框架的操作如果你要将一个框架拆分成几个更小的框架，请执行以下操作：如果你要拆分插入点所在的框架，从【修改】

8、【框架集】子菜单选择拆分项，如图所示。如果你要以垂直或水平方式拆分

9、一个框架或一组框架，请将框架边框从“设计”视图的边缘拖入“设计”视图的中间。如果你要使用不在“设计”视图边缘的框架边框拆分一个框架，请在按住Alt键的同时拖动框架边框。如果你要将一个框架拆分成四个框架，请将框架边框从“设计”视图一角拖入框架的中间。8.2.3拆分框架8.2框架的操作增加新框架的具体操作步骤如下：（1）把光标定位在文档中。（2）选择“插入”面板上的“布局”选项卡，单击“框架”按钮上的下拉箭头，然后选择预定义的框架集。例如选择“顶部和嵌套的左侧框架”，创建如图8-4所示的框架。（3）例如想要拆分图所示的框架的上框架，则将光标定位在上框架中，选择【修改】

10、【框架集】

11、【拆分左

12、框架】菜单选项，效果如图示。8.2.4增加、删除框架8.2框架的操作1．如果你要保存框架集文件，请执行以下操作（1）在“框架”面板或“文档”窗口中选择框架集。（2）执行下列操作之一：若要保存框架集文件，请选择【文件】

13、【保存框架集】菜单命令（其快捷键为【Ctrl+S】）。如图所示。若要将框架集文件另存为新文件，请选择【文件】

14、【框架集另存为】菜单命令。8.2.5保存框架8.2框架的操作8.2框架的操作8.2.5保存框架2．如果你要保存框架中显示的文档，请执行以下操作在框架中单击，然后选择【文件】

15、【保存框架】菜单命令（其快捷键为【Ctrl+S】），如图所示，或选择【文件】

16、【框架另存为

17、】菜单命令（其快捷键为【Ctrl+Shift+S】）。8.2框架的操作选择【文件】

18、【保存全部】菜单命令。该命令将保存在框架集中打开的所有文档，包括框架集文件和所有带框架的文档。如果该框架集文件未保存过，则在“设计”视图中框架集的周围将出现粗边框，并且出现一个对话框，你可从中选择文件名。对于尚未保存的每个框架，在框架的周围都将显示粗边框，并且出现一个对话框，你可从中选择文件名。如图所示。8.2.5保存框架8.3在框架中插入页面如果你要在框架中插