Dreamweaver8网页设计培训教程 09 使用框架布局网页.pptVIP

9.3.2 完善“古塔丽影”框架网页 本次练习将完善“古塔丽影”框架网页。 素材位置：【\第9课\素材\gtly\】 效果图位置：【\第9课\源文件\gtly2.html】 9.3.2 完善“古塔丽影”框架网页 操作思路： 完成各框架页面的制作。 打开“gtly1.html”框架集网页，将其另存为“gtly2.html”。 首先设置框架集的属性，设置边框为无，边框宽度为“0”，各框架的高度分别为“86”、“202”、“18”、“110”。 再设置各框架的属性，设置边框为不显示，不能调整大小，除“main.html”框架设置为滚动外，其他都设置为不滚动。 Dreamweaver 8网页设计培训教程 第9课 使用框架布局网页 本课要点 具体要求 本课导读 上机练习 本课要点 了解框架并创建框架 框架及框架集的基本操作和属性设置 具体要求 了解框架及框架集 熟悉框架及框架集的创建 掌握框架及框架集的基本操作 掌握框架及框架集的属性设置 本课导读 使用框架可以避免重复劳动，如将共同的部分（顶部的导航区、版权信息区）分别制作成单独的网页，然后通过框架将其链接到各个框架网页中，而不必每个网页都重新制作这些共同的部分，从而节约了时间，也可以减少整个网站的大小。 9.1 了解框架并创建框架 在布局页面时除了可以使用层和表格外，还可以使用框架进行布局，下面介绍框架的概念及创建方法。 9.1 了解框架并创建框架 9.1.1 知识讲解 9.1.2 典型案例——“精品欣赏”网页框 架制作 9.1.1 知识讲解 框架的功能是把浏览器窗口划分为若干个区域，分别显示不同的网页。框架集的功能是定义一组框架的布局和属性。 9.1.1 知识讲解 1.了解框架及框架集 2.框架及框架集的创建 3.框架及框架集的保存 1.了解框架及框架集 在网页上定义的一个区域就是单个框架，而框架集则记录了同一个网页中多个框架的布局、超链接和属性信息。 利用框架可以把浏览器窗口划分为若干个区域，每个区域可以添加任意网页元素，也可分别显示不同的网页。 1.了解框架及框架集 框架集与框架之间的关系其实就是包含与被包含的关系，框架集相当于一个容器，框架则是放在容器中的东西，框架集记录了框架的位置，以及框架中包含的网页的链接地址。 2.框架及框架集的创建 Dreamweaver 8的预定义框架集可以直接创建，也可在页面中加载。 1）直接创建预定义框架集 2）加载预定义框架集 3）手动创建框架集 3.框架及框架集的保存 框架创建完成后，可将其保存起来。在Dreamweaver 8中保存框架和框架集与一般网页文档的保存有所不同，可以保存某个框架文档，也可以单独保存框架集文档，还可保存框架集和框架中出现的所有文档。 1）保存框架文档 2）保存框架集文档 3）保存框架集中的所有文档 9.1.2 典型案例——“精品欣赏”网 页框架制作 案例目标 本案例主要练习利用框架布局页面。本例中共有5个框架，其中顶部及底部各1个，中间共3个框架。 效果图位置：【\第9课\源文件\jingpin1\kuangjia1.html】 9.1.2 典型案例——“精品欣赏” 网页框架制作 操作思路 （1）首先创建一个“上方固定，下方固定”类型的框架集。 （2）然后将中间的框架进行分割、调整，使其中间具有3个框架。 （3）最后保存框架及框架集即可。 9.1.2 典型案例——“精品欣赏” 网页框架制作 操作步骤 具体操作步骤请教师参照软件和书中内容进行讲解。 9.1.2 典型案例——“精品欣赏” 网页框架制作 案例小结 本案例练习了框架页面的创建及保存，其中要重点掌握的是手动进行框架拆分的方法，要区分按住【Alt】键与未按住【Alt】键而直接拆分时的区别。另外，本案例中保存框架及框架集时都使用了快捷键，用户可在Dreamweaver 8的【文件】菜单中找到与命令对应的快捷键。 9.2 框架及框架集的基本操作和属性设置 框架创建完成后，还需对其进行一些操作，如选择框架、设置属性、链接网页等 。 9.2 框架及框架集的基本操作和属性设置 9.2.1 知识讲解 9.2.2 典型案例——“精品欣赏”网页框 架属性设置 9.2.1 知识讲解 框架及框架集可进行选择、删除等操作 。 9.2.1 知识讲解 1.框架及框架集的基本操作 2.删除框架 3.框架及框架集的属性设置 1.框架及框架集的基本操作 在对框架和框架集进行属性设置以及其他操作前，需要先选择相应的框架和框架集。 1）认识【框