网页设计与制作项目6 框架的应用.ppt

* * * * * * * * * * 任务6.1.4 查看与设置框架和框架集的属性 1 （2）设置框架集的属性 使用“属性”检查器可以查看和设置大多数框架集属性，通过“属性”面板可以设置边框和边框大小。设置框架属性会覆盖在框架集中设置的相应属性。如，设置某个框架的边框属性，将覆盖在框架集中对该框架设置的边框属性。 选择框架集，打开框架集的“属性”面板，进行设置。 任务6.1.4 查看与设置框架和框架集的属性 1 （3）设置框架集的属性 使用“属性”检查器可以查看和设置大多数框架集属性，通过“属性”面板可以设置边框和边框大小。设置框架属性会覆盖在框架集中设置的相应属性。如，设置某个框架的边框属性，将覆盖在框架集中对该框架设置的边框属性。 选择框架集，打开框架集的“属性”面板，进行设置。 任务6.1.4 查看与设置框架和框架集的属性 1 （4）设置框架集的网页标题 设置框架集的网页标题，只需选择要设置框架集网页标题的框架集，在文档工具栏的“标题”文本框中输入网页标题即可。 （5）设置框架的背景颜色 如果需要改变框架中文档的背景颜色，改变所在的背景颜色来改变文档的背景颜色。 （6）为不支持框架的网页设置内容 指定在基于文本的浏览器和不支持框架的旧式图形浏览器中显示的内容。在框架集文件中，用noframes标签括起来。当不支持框架的浏览器加载该框架集文件时，浏览器只显示包含在noframes标签中的内容。 任务6.1.5 浮动框架 1 浮动框架是一种特殊的框架页，与其他类型的框架页不同，浮动框架对框架集网页没有依赖性，可以在一个页面中嵌入其他页面，也可以存放于任意的网页文档中，使用<iframe>标签即可实现浮动框架功能。 任务6.1.5 浮动框架 1 （1）建立浮动框架 浮动框架是通过在代码窗口中添加“<iframe>…</iframe>”标签来嵌入框架的。 （2）设置浮动框架属性 在建立完浮动框架后，需要指定浮动框架的名称、大小以及是否需要滚动条等属性。设置浮动框架属性可以通过“视图”模式下设置，也可以在浮动框架的“标签检查器”面板中设置。 任务6.1.6 使用链接控制框架的内容 1 若要在一个框架中使用链接打开另一个框架中的文档，必须设置链接目标。链接的target 属性指定在其中打开所链接内容的框架或窗口。 1．相对链接目标_top 2．绝对链接目标 【上机实践】 实践1 制作一个三栏框架网页。 实践2 利用Dreamweaver CS5框架进行网页布局。网页共分为4个框架，顶部为标题部分，左侧为导航部分，右侧为主体部分，底部为版权说明部分。浏览网页时可以通过单击左侧导航栏中的链接切换主体部分的网页内容。 网页中共分4个框架。顶部为标题部分，显示网页的大标题；中间左侧为导航部分，提供各网页的导航链接；中间右侧为主体部分，显示网页主要内容；底部为说明部分，主要包括一些版权信息。 实践3 利用Dreamweaver CS5的框架及框架集有关知识，制作一个网站后台管理页面，主要练习框架集及框架的创建、编辑等方法。 操作思路提示： ①创建框架网页 ②保存框架集 ③设置框架及框架属性 ④设置框架集属性 【常见面试题】 1 简述创建框架集网页的步骤？ 2 简述基本的框架集网页主要包括哪4种？ 3 <iframe>嵌入框架标签与普通的<iframe>框架标签有什么区别？ 4 如何在文档窗口中创建一个上下划分的框架，然后在下面的框架中创建一个左右划分的子框架？ 5 如何在框架中使用链接？ * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * 项目6 框架的应用 1 网页设计与制作 项目6 框架的应用 本章简介： 　　框架的出现大大地丰富了网页的布局手段以及页面之间的组织形式。浏览者通过框架可以很方便地在不同的页面之间跳转及操作， BBS论坛页面以及网站中邮箱的操作页面等都是通过框架来实现的。 通过本章的学习，读者可以掌握框架和框架集的相关概念，在设计网页时能熟练应用框架与框架集制作框架网页。 项目目标 认识框架及框架集的概念 创建框架及框架集 嵌套框架 设置框架及框架集的属性 框架内容的控制 制作框架网页 任务6.1 认识框架及框架集 1 框架的功能是把浏览器窗口划分为若干个区域，分别显示不同的网页。框架由框架集和单个框架两个主要部分组成。 框架是浏览器窗口中的一个区域，在框架中可以显示其他的网页。 框架集是HTML文件，它定义一组框架的布局和属性，