框架布局2.pptVIP

学习目标 通过本次课的学习，学生具有使用框架进行页面布局的能力。 本次任务 利用DW工具设计网页 要求：1、用框架布局 2、内容丰富，布局合理 Iframe属性 浮动框架除了可以使用普通块状对象的属性，也可以使用一些专有的属性，例如，框架独有的属性和浮动框架独有的属性。浮动框架的各种属性如下所示。 * 属性值 说明 top 顶部对齐，使用此属性值后，浮动框架将对齐在其父对象的顶端。 middle 居中对齐，使用此属性值后，浮动框架将对齐在其父对象的中间。 left 左侧对齐，使用此属性值后，浮动框架将对齐在其父对象的左侧。 right 右侧对齐，使用此属性值后，浮动框架将对齐在其父对象的右侧。 bottom 底部对齐，使用此属性值后，浮动框架将对齐在其父对象的底部。 创建框架和框架集 演示： 演示： 编辑框架和框架集 演示： 框架链接 LOGO LOGO LOGO LOGO LOGO LOGO LOGO LOGO 框架布局 主讲：陈婉如 cwanru@126.com 框架布局 创建框架和框架集 1 编辑框架和框架集 2 框架链接 3 本次课的任务 4 框架网页 * 框架提供将一个浏览器窗口划分为多个区域、每个区域都可以显示不同HTML文档的方法。使用框架的最常见情况就是，一个框架显示包含导航菜单的文档，而另一个框架显示包含内容的文档。 框架网页概述 * 很多用户可能将网页中的框架看成是一个文件，但实际上文档不是框的一部分，而框是存放文档的容器。 1．框架集 框架集是HTML文件，它定义一组框架的布局和属性，包括框架的数目、框架的大小和位置以及最初在每个框架中显示的页面的URL。 * 2．框架集的优势 3．嵌套的框架集 框架的最常见用途就是导航。一组框架通常包括一个含有导航条的框架和另一个要显示主要内容页面的框架。 在另一个框架集中的框架集称为嵌套框架集。一个框架集文件可以包含多个嵌套的框架集。大多数使用框架的Web页实际上都使用嵌套的框架，并且在Dreamweaver中大多数预定义的框架集也使用嵌套。如果在一组框架里，不同行或不同列中有不同数目的框架，则要求使用嵌套的框架集。 创建各种框架 在Dreamweaver中有两种创建框架集的方法：既可以从若干预定义的框架集中选择，也可以自己设计框架集。 * * 1．创建框架集 在Dreamweaver中，创建框架集是非常简单的。 * 2．创建嵌套框架集 将光标放置框架集的顶部中，单击【框架】下拉按钮，然后在列表中选择一种框架布局方式，则该框架集就是嵌套框架集。 * 3．创建浮动框架 要想在一个HTML网页的局部显示另外一个HTML网页，就需要用到浮动框架。浮动框架是一个HTML网页在另外一个HTML网页中显示的容器。浮动框架可以在空白页面中创建，也可以在表格中创建。 编辑框架集 【框架】面板提供框架集内各框架的可视化表示形式。它能够显示框架集的层次结构，而这种层次结构在【文档】窗口中的显示可能不够直观。 在【框架】面板中，环绕每个框架集的边框非常粗；而环绕每个框架的是较细的灰线，并且每个框架由框架名称标识。 * 1．在面板中选择框架 2．选择布局框架 3．选择不同的框架 向框架中添加内容 在选择框架后，可以向框架不同部分的文件（框架中每一个部分，都是一个独立的文件。）中添加内容，也可以指定为现在文件。 * 1．添加框架文档 2．为框架添加内容 用户可以通过将新内容插入框架的空文档中，或通过在框架中打开现有文档，来指定框架的初始内容。 无论是框架还是框架集，均是显示HTML网页的容器。要添加网页元素则是在框架网页中，而在框架网页中添加元素，与普通网页的操作方法相同，同样可以在其中插入表格、文本、图像、多媒体等。 保存框架集 如果一个站点在浏览器中显示为包含两个框架的单个页面，则实际上至少由三个HTML文档组成：框架集文件以及两个文档，这两个文档包含最初在这些框架内显示的内容。在Dreamweaver中设计使用框架集的页面时，必须保存所有这三个文件，该页面才能在浏览器中正常显示。 * 1．框架集保存 2．嵌套框架集保存 框架属性 选择不同的框架部分，会得到不同的属性。而框架集网页中，有些框架网页为固定网页，而框架集中的mailFrame框架网页为活动网页，所以框架集的超级链接目标与普通网页会有所不同。 * 布局框架基本属性 由于布局框架中包括框架集和框架，所以在设置其属性时也不