HTML学习五框架.ppt
第五章 表单,本章任务,制作“客户中心”页面,会使用框架结构实现多窗口展示页面,本章目标,框架,广告栏顶部框架(top.htm),导航栏左侧框架(left.htm),详细内容页面右侧框架(main.htm),框架的边框,框架集页面(FrameSet.htm),框架使用场合,页面的一个固定部分显示徽标或静态信息,在另一个固定部分显示导航部分详细内容,在此处显示详细内容,页面中此部分是变化的。,框架的基本结构,框架页面的基本语法,边框尺寸大小,将窗口分割成左中右3个部分,可选,将窗口分割成上下2个部分,可选,第一个窗口要显示的网页,框架的基本结构,rows_cols框架,将窗口分割成上中下3部分,窗口边框的宽度,如果要在浏览器中创建左中右三个窗口,该如何实现?,查看源代码,每个窗口对应一个页面,以及一个框架集页面,总共需要几个HTML页面文件?,如何创建多个复杂的窗口,要实现如下图所示的窗口,该如何制作?,1、分成上下两个窗口2、把下面的窗口分成 左右两个窗口,top窗口,left窗口,right窗口,如何创建多个复杂的窗口,创建多个复杂的窗口实现步骤如下:1、创建一个HTML页面“top.html”2、创建一个HTML页面“left.html”3、创建一个HTML页面“right.html”,top.html效果图,left.html效果图,right.html效果,如何创建多个复杂的窗口,4、新建多框架HTML页面“Frame_Sets.html”,.,查看源代码,设置无框架边框,不显示滚动条,禁止调整框架大小,框架名称,便于超文本链接锚标签target属性所引用,如何设置窗口链接的显示位置,如果在同一个页面中,要实现在一个框架窗口中的超链接页面出现在另一个框架窗口中,如何实现?,演示示例2:不同框架之间超链接效果,使用target目标窗口属性,如何设置窗口链接的显示位置,target目标窗口属性name“显示的窗口名”,target属性指定了所链接的文件出现在名称为“窗口名”的框架窗口里。,target属性指定了所链接的文件出现在名称为“rightframe”的框架窗口里,演示示例3:使用target=“窗口名”,查看源代码,如何设置窗口链接的显示位置,target目标窗口属性四个特殊的窗口 显示在新窗口 显示在本窗口 显示在父窗口 显示在整个浏览器窗口,新启一个窗口打开文件“right.html”,演示示例4:使用四个特殊的窗口,小结2,top.html,left.html,right1.html或right2.html,frame_sets.html,练习答案,练习代码,编写如下图所示效果对应的html代码,总结,创建一个框架页面至少需要哪两个标签?target设定目标资源所要显示的窗口,其取值可以为哪些?简述创建一个多框架页面所需的主要步骤。,