第11章 创建框架网页.ppt

第11章 创建框架网页 框架是一种特殊的网页，它将一个页面分成几个部分，其中每个部分都是相互独立的。框架中的超级链接可以指定到目标框架，这样在打开超级链接的时候，整个页面会保持不变，只是将链接的内容在目标框架中显示。在一个网页中，在有些情况下并不是所有的内容都需要改变，如网页的导航栏、网页标题等部分。如果在每个网页中都重复插入这些元素，就会浪费大量的时间，在这种情况下，使用框架就会解决以上问题。 11.1 关于框架 使用框架结构也有其优缺点。 框架结构的优点如下： 统一的风格。一个网站中通常有很多页面具有相同的部分，从而做到网站总体的风格统一。可以把这个相同的部分单独做成一个页面，作为框架结构中的一个框体的内容公用于整个站点。通过这种方法，能达到网站的整体风格的统一。 便于修改。一般情况下，每过几个星期或几个月，网站的设计就要做出一个更改。可以把每页都要用到的公共内容制作成单独的网页，并作为框架结构一个框体的内容提供给整个站点公用，每次修改时，只需要更改这个公共网页，就能完成对整个网站的设计更改。 便于访问。一般公共框体的内容都做成网站各主要栏目的链接，当浏览器的滚动条滚动时，这些链接不随滚动条的滚动而上下移动，而是一直固定在浏览器窗口的某个位置，使访问者能随时单击跳转到另一页面。 11.2 创建框架集和框架 框架是浏览器窗口中的一个区域，它可以显示与浏览器窗口的其余部分中所显示内容无关的HTML文档。框架集是HTML文件，用来定义一组框架的布局和属性，包括框架的数目、框架的大小和位置以及在每个框架中初始显示页面的URL。 当一个页面被划分为若干个框架时，Dreamweaver就会自动建立一个框架集文件，同时为每个框架建立一个文档文件。也就是说，一个包含有3个框架的网页实际上是由4个文件组成：框架集文件和3个包含在框架中显示的内容文件。在使用框架集设计网页时，为了使该网页能在浏览器中正常工作，必须对这4个页面都进行保存。 11.2.1 使用预定义的框架集 使用预定义的框架集是一种创建基于框架布局的最简单的方法，能够自动创建布局所需的所有框架和框架集。一般在文档窗口的设计视图中插入预定义的框架集。通过预定义的框架集，可以很容易地选择要创建的框架的类型。 11.2.2 创建嵌套框架集 在另外一个框架集之内的框架集称为嵌套的框架集。一个框架集文件可以包含多个嵌套的框架集。但凡使用框架的网页实际上都使用嵌套的框架，并且在Dreamweaver中大多数预定义的框架集也使用嵌套。如果在一组框架里，不同行或不同列中有不同数目的框架，则要求使用嵌套的框架集，具体操作步骤如下。 （1）打开框架网页，将鼠标置于右侧框架中，选择“修改”|“框架集”|“拆分右框架”命令。 （2）选择“拆分右框架”命令后可以看到嵌套框架的效果，如图11.4所示。 11.2.3 手动设计框架集 手动设计框架集有更大的自由度，可以任意控制拆分的方式，以及高度和宽度。手动设计框架集的具体操作步骤如下。 （1）打开框架网页，选中框架，将插入点放置在框架的边缘，变成拖拽图标时，按住鼠标左键对其拖动，如图11.5所示。 （2）还可以将鼠标置于编辑窗口四角的框架边框交接处，出现十字形拖拽图标后，按住鼠标左键拖动，将网页拖出四部分的框架。 11.3 框架的基本操作 框架创建完成后，还需要对其进行一些操作，如选择框架、设置属性、链接网页等。框架及框架集可进行选择、删除等操作。本节将讲述选项框架和框架集、删除框架以及保存框架的框架集的具体操作方法。 11.3.1 选择框架和框架集 在网页中当鼠标指针靠近框架集的边框且出现上下箭头时，单击整个框架集的边框，就可以选择整个框架集。选择框架和框架集的方法如下。 （1）按住Shift+Alt键单击欲选择的框架将其选择，这时，在所选的框架边框内侧出现虚线，表示该框架已选择，如图11.6所示。 （2）选择“窗口”|“框架”命令，打开框架面板。在面板中单击欲选择的框架，这时所选择的框架边框内侧将出现虚线，如图11.7所示。 （3）在文档窗口中，当鼠标指针靠近框架集的边框且出现上下箭头时，单击整个框架集的边框，便可选择整个框架集，如图11.8所示。 （4）选择“窗口”|“框架”命令，打开框架面板。在面板中单击框架集的边框，这时可选择整个框架集，如图11.9所示。 11.3.2 删除框架 要删除一个框架时，要将鼠标置于创建好的框架上，拖动框架至边框上。如果页面上有多个框架，可将其拖到父框架的边框上，即可删除框架。 11.3.3 保存框架和框架集 在浏览器中预览框架集之前，必须先保存框架集文件以及要在框架中显示的所有文档。实际上，当用户创建框架时就已经默认存在了框架集和框架文件了，默认的框架集名称是UntitleFrame-1、Untit