边做边学——Dreamweaver CS3网页设计案例教程教学课件 官辛华 06.pdfVIP

第6章　使用框架 本章简介： 框架的出现大大地丰富了网页 的布局手段以及页面之间的组织 形式。浏览者通过框架可以很方 便地在不同的页面之间跳转及操 作，BBS论坛页面以及网站中邮 箱的操作页面等都是通过框架来 实现的。 课堂学习目标 框架与框架集 框架的属性设置 6.1　办公用品网页 案例分析 设计理念 操作步骤 相关工具 6.1.1　案例分析 办公用品网页的功能是展示办公用品，发布产品的促销信息，为 客户提供在线帮助。在设计网页时要注意办公用品的特色和客户端 的真实需求，处理好页面布局及素材之间的比例关系，进行合理的 配色和编排。 6.1.2　设计理念 在网页设计、制作过程中，考虑到办公用品的时代感，界面的规 划也要体现出现代气息。在背景处理上挑选了最具代表性的打印机 和透明色块相接合，体现办公的节奏和效率。左下方是产品的介绍 说明，方便用户浏览和查看。右下方是最新产品的展示图。 办公用品网页效果图 6.1.3　操作步骤 1 2 3 4 6.1.4　相关工具 1. 建立框架集 在Dreamweaver CS3 中，可以利用可视化工具方便地创建框架集。用户 既可以通过菜单命令实现，又可以通过“插入”面板“布局”选项卡中的“框架” 按钮实现。 通过“新建”命令建立框架集 通过“插入记录”命令建立框架集 通过“框架”按钮建立框架集 通过拖曳“框架”按钮到窗口中建立框架集 2.为框架添加内容 因为每一个框架都是一个HTML文档，所以可以在创建框架后，直接编辑某个 框架中的内容，也可在框架中打开已有的HTML文档，具体操作步骤如下。 （1）在文档窗口中，将光标放置在某一框架内。 （2）选择“文件 在框架中打开”命令，打开一个已有文档。 3.保存框架 保存框架时，分两步进行，先保存框架集，再保存框架。初学者在保 存文档时很容易糊涂，明明认为保存的是框架，但实际上保存的是成框 架集；明明认为保存的是某个框架，但实际上保存成框架集或其他框架。 因此，在保存框架前，用户需要先选择“窗口 属性”命令和“窗口 框架”命令，启用“属性”面板和“框架”控制面板。然后，在“框架” 控制面板中选择一个框架，在“属性”面板的“源文件”选项中查看此 框架的文件名。用户查看框架的名称后，在保存文件时就可以根据“保 存”对话框中的文件名信息知道保存的是框架集还是某框架了。 保存框架集和全部框架 保存框架集文件 保存框架文件 4.框架的选择 在对框架或框架集进行操作之前，必须先选择框架或框架集。