第六章 框架和框架集.pptVIP

Dreamweaver mx 第六章 网页框架 主讲:任志海 第六章 网页框架 教学目标:了解并掌握框架集使用的基础本方法,并能够在文档中使用框架 教学重点与难点: 什么是框架与框架集 框架使用 第六章 网页框架 一、框架使用： 上网时候，经常看到点击左边，内容从右边出来一类的网页，其实就是框架的应用了。 在Dreamweaver MX中以创建框架，使用预设框架集(已有的框架样式) 中选择需要的框架集即可 1.预设框架集的使用 在创建预设框架集或处理框架前，应该先使文档窗口中的框架边框可见，方法如下：打开菜单，执行：“查看|可视化助理|框架边框”可以显示框架的边框。 第六章 网页框架 绘制框架：切换框架页，单击对应框架样式就可 请做出如下框架集 第六章 网页框架 选择插入工具栏中的框架 选择框架工具栏中 的 输入文字 完成 第六章 网页框架 练习:做出如下框架集 第六章 网页框架 做出如下框架 第六章 网页框架 教学目标:掌握框架的拆分及框架的保存,学会利用框架面板选择框架 重点与难点: 框架的拆分 框架的保存 框架面板的使用 2、框架的拆分我们设计的框架样式不一定在都有,通过对框架的拆分，可以设计自己所需的框架。在插入预设框架集后，就可以通过对框架集进行修改来满足我们的需要。方法如下：首先将光标定位到要拆分的框架当中，然后打开菜单，执行：“修改|框架页”菜单项,其下包括了四个用于分隔框架的命令，如下： 第六章 网页框架 把左别的框架拆分为右别的框架 第六章 网页框架 第六章 网页框架 操作步骤: 新建网页 建立如上左图的框架 光标落入下边右边的框架内 选择修改|框架|拆分左框架 做出如下框架 第六章 网页框架 二、保存框架因为每一个框架都对应一个独立的HTML页面，因此，框架的保存和一般网页有所不同。在Dreamweaver MX中，可以分别保存框架页面和框架集页面，也可以同时保存所有打开的框架页面和框架集页面，保存才可以浏览器中浏览。方法如下：要保存框架集文件，应该选中整个框架集执行“文件|保存|保存框架页”命令。 第六章 网页框架 做出并保存下列框架页为kj1.html,并保存每一框架. 第六章 网页框架 做出并保存下列框架页为zkj.html,并保存每一框架. 第六章 网页框架 教学目标:掌握框架集的属性设置, 教学重点:框架集的属性 第六章 网页框架 做出如下框架 第六章 网页框架 第六章 网页框架 建立如图所示的框架集 选择mainFrame框架 单击源文件后的浏览按钮 选择rbsr.html 单击确定 第六章 网页框架 做出如下框架,并在mainFrame框架中显示一个文件 第六章 网页框架 教学目标:掌握运用链接控制框架内容 教学重点: 在框架中运用链接 处理浏览器不能显示的框架 第六章 网页框架 例:做出如下框架,并运用链接控制主框架内的显示内容.当选择”文件”时,在主框架中显示一HTML文档”,当选择图片时,显示一JPG图片 第六章 网页框架 练习:请做出如下的框架,并使的当选择数学计算机系时,在主框架中显示数学计算机信息,当选择其它系时在主框架中同样显示对应系信息. 值得注意的就是链接问题了，在框架中使用超级链接时，必须为链接设置一个目标，这个目标是指框架内链接所需要打开的内容显示在哪个框架内。框架集中，无论你所采用的是哪种预设框架，在这些框架中，总会存一个主框架，从框架面板中就可以看到，有一个Mainframe，这就是一个主框架的标志。需要说明的是：在某个框架页中设置超级链接后，在属性面板中设置其链接打开的目标时，与以前相比，有所不同，打开目标下拉框后，将看到如下选项： 五、框架和超级链接 第六章 网页框架 Blank:在新的窗口中打开链接文档，并保留当前窗口。parent:在链接的父窗口内显示链接文档。self:在当前窗口中打开链接文档，替换当前框架中内容。top:在当前文档最外边的框架集中打开链接文档，替换所有框架。mainframe:在主框架中打开链接。leftframe:在左侧框架中打开链接。Topframe:在顶部框架中打开链接。 第六章 网页框架 文件 图片 教学资源网 * * 定义：框架与框架集 框架是我们在网页设计过程中经常用到一种技术，它可以将一个网页分割成多个HTML页面，每一个框架都是一个独立HTML页面。 框架集可以使网页中所有的框架能够很好的组织在一起，并协调工作。所谓框架集，就是指定义网页结构与属性的HTML页面的集合，通过设置框架和框架集的属性，可以控制框架的外观等。 第六章 网页框架 2.然后，打开插入面板组中的框架页面，将看到如下图