五年级信息技术下册第二单元制作网页第13课《制作框架网页》课件2新人教版.pptx

第3章 制作框架网页,课前导读 课堂讲解 上机实战 任务小结,课前导读,基础知识 重点知识,基础知识,框架的作用、框架及框架集的概念。,重点知识,框架网页的作用和功能，框架的建立与属性设置，框架中各个页面之间的关联，每个框架中页面的设置方法，框架网页的保存方法。,课堂讲解,认识框架网页 设计框架网页 建立框架 制作框架页面 保存框架网页 为框架网页创建超链接 设置框架网页的属性,一、认识框架网页,了解框架的作用 了解框架及框架集的概念 认识框架及框架集,1、框架网页的作用：是将浏览器窗口划分为若干个不同的区域，每个区域可以分别显示不同的网页。 2、框架的组成：框架集和单个框架。 3、框架集和单个框架的定义：框架集是指框架网页显示的框架数、框架的大小、载入框架的网页源和其他可定义的属性等。单个框架是指在网页上定义的一个区域。 4、框架网页：是通过超链接将不同的单个框架建立起了联系，从而实现页面的导航和页面间的交互操作。,5、认识框架网页的视图 （1）用FrontPage打开一个框架网页，单击“设计”选项卡，进入“设计”视图。 （2）单击“拆分”选项卡，进入“拆分”视图。 （3）单击“无框架”选项卡，进入“无框架”视图。 （4）单击“代码”选项卡，进入“代码”视图。 （5）单击“预览”选项卡，进入“预览”视图。,二、设计框架网页,将“多面的我”网页设计为框架网页。,知识充电站： 如果一个站点在浏览器中显示为包含3个框架的单个页面，则它实际上至少由4个单独的页面组成：框架集页面以及3个单个页面，这3个单个页面包含这些框架内初始显示的内容。当在Frontpage中设计使用框架集的页面时，必须全部保存这4个页面，以便该页面可以在浏览器中正常工作。,三、设计框架网页,1、在FrontPage的菜单栏中选择“文件/新建/网页”，在右侧“新建”任务窗格中，单击“其他网页模板”，弹出“网页模板”对话框架。 2、在“网页模板”对话框中，单击“框架网页”选项卡，根据需要，选择框架网页模板（如“横幅和目录”），单击“确定”按钮，即打开一个“横幅和目录”的框架网页。,四、制作框架页面,1、单击横幅框架中的“新建网页”按钮为横幅框架新建空白网页。 2、单击目录框架中的“新建网页”按钮为目录框架新建空白网页。 3、单击主要框架中的“设置初始网页”按钮为主要框架选择已存在的页面作为框架页面（如“wen.htm”）。 4、编辑横幅框架（新建网页）：输入文本（如“多面的我”），并进行适当的文本修饰。 5、编辑目录框架（新建网页）：输入文本并进行适当修饰。 6、按照框架网页的结构和布局，对框架网页进行适当地修饰。,想一想：如果网页中文字比较大，框架不能完全显示，能不能调整框架的显示区域的大小。,知识充电站 超链接，英文名HyperLink，是指从一个网页指向一个目标的链接关系，这个目标可以是另一个网页、相同网页的不同位置、图片、电子邮件、文件，甚至应用程序。各个网页通过超链接链接在一起后，才能真正构成一个网站。超链接的起点可称为链接源；超链接的终点可称为链接目标。,提示板 单击“设置初始网页”按钮，会弹出一个“插入超链接”的对话框，选择的超链接对象就是该框架区域将显示的内容。,五、保存框架网页,1、在菜单栏中选择“文件/保存”，弹出“另存为”对话框。 2、在“另存为”对话框中一一保存各个框架（如横幅框架、目录框架和主要框架）。 （1）在“另存为”对话框中，输入对应文件和网页标题，保存“横幅框架”。 （2）单击“保存”按钮后，预览框中又选中了目录框架，输入对应文件名和网页标题，保存“目录框架”。 （3）保存完目录框架后，预览框中显示选择了整个网页框架，输入对应的文件名和网页标题，保存网页设置文件。,六、为框架网页创建超链接,1、在FrontPage的菜单栏中选择“文件/打开”，在弹出的“打开文件”对话框中，选择框架网页设置文件（如“dmdw.htm”）单击“打开”按钮，打开使用框架网页制作的网页。 2、选择目录框架中的对应文字作相关网页的链接。 （1）选中文字（如“好动的我”），在菜单栏中单击“插入/超链接”，打开“插入超链接”对话框。 （2）单击对话框中“目标框架”按钮，打开“目标框架”对话框。 （3）在“当前框架网页”预览中，点选需要改变浏览内容的框架（如主要框架main），单击“确定”按钮。 （4）在“插入超链接”对话框选择链接的网页文件（如“dong.htm”）单击“确定”按钮。 （5）通过浏览器打开dmdw.htm文件查看效果。 （6）回到FrontPage“设计”视图，制作其他两个链接。,七、设置框架网页的属性,1、设置框架集的边框。 （1）先选中整个框架网页，然后在菜单栏中选择“文件/属性”，打开“网页属性”对话框。 （2）单击“框架”选项卡，进入框架集的属性设置页面，取消“显示边框”。 （3）单击“预览”，查看效果。 2、设置滚动条的显示 （1）选中需要修改的单个框架，在菜单栏中选择“框架/框架属性”，打开“框架属性”对话框。 （2）在“框架属性”对话框中设置滚动条的显示方式（如可选择“需要时显示”、“不显示”、“始终显示”），单击“确定”按钮即可查看效果。,任务