第四章(框架和嵌入式框架)

1、第四章 框架与嵌入式框架,课程回顾,等标记构成表格 和的区别 表格的尺寸颜色（背景、边框） 跨行跨列的表格 表格的美化修饰(背景图，居中，边距等) 表格填充属性cellpadding cellspacing 用表格嵌套，排列，填充实现页面布局,本章要点,框架标记 各窗口尺寸设置 各窗口间相互操作(Frame Target) IFrame的外观 IFrame的使用,框架,广告栏顶部框架(top.htm),导航栏左侧框架(left.htm),详细内容页面右侧框架 (main.htm),框架的边框,框架集页面(FrameSet.htm),多窗口页面(Frames),使用Frames结构，能够将整个窗

2、口分成几个独立的小窗口 每一个窗口可分别载入不同的文件，每个窗口是可以相互沟通。 Framees结构中的每个URL值指定了一个事先做好的文件,上中下排列的窗口,每个窗口对应一个页面，以及一个框架集页面，总共需要几个HTML页面文件？,FRAME,FRAME,FRAME,FRAMESET,框架标记, ,将窗口分割成上中下3部分,窗口边框的宽度,如果要在浏览器中创建左中右三个窗口,该如何实现？,在上例中主要用到了下列代码,查看源码,结构简述,出现标记的文档中，将不再使用标记, ,注意： frame在Frameset 中间 没有BODY,三窗口框架,top.html效果图,left.html效果图,

3、right.html效果,多个复杂的窗口, ,设置无框架边框,不显示滚动条,禁止调整框架大小,框架名称，便于超文本链接锚标签target属性所引用,各窗口尺寸设置, ,其中的任何一个数字也可以由“*”来代替,如： 将100像素以外的窗口平均分配 将窗口分为三等份 s,框架可以将窗口分割为几块，横向分用ROWS属性，纵向分用COLS属性，每一块的大小可以由这两个属性的值来实现,可以由数字或百分比来实现,窗口间相互操作,由Frames分出来的几个窗口的内容并不是静止不变的，往往一个窗口的内容随着另一个窗口的要求而不断变化 我们必须为每一个窗口起一个名字，这个名字用属性Name来定义,例如： ,Ta

4、rget属性,定义了窗口名称，还应该有Target来配合使用，Target属性指定了所链接的文件出现在哪一窗口。Target的值可以是name定义的名称，也可以是以下四类值:, 显示一个新窗口 显示在同一个窗口 显示在前一份文件的窗口 显示在整个浏览器窗口,Target示例一,right页面 buy页面,target属性指定了所链接的文件出现在名称为“rightframe”的框架窗口里,Target示例二, right.html buy.html sale.html person_info.html ,新启一个窗口打开文件 “right.html”,在本身窗口打开文件 “buy.html”,在

5、前一窗口显示sale.html,在整个浏览器窗口显示all.html,各窗口边框的设置, ,Frameborder属性用来设定各窗口边框的设置， yes表示有边框，no表示没有边框,查看源码,边框色彩, ,bordercolor=#属性用来设定边框色彩,查看源码,边界宽度, 用来设定各窗口的上下左右边界宽度 #的值为像素点,marginwidth=5,marginwidth=10,marginwidth=50,查看源码,各窗口间空白区域,framespacing=# 属性用来设定各窗口间空白区域，其中#为空白区域的大小,如图所示：红色和黑色部分 表示各窗口的空白区域,framespacing

6、=50,查看源码,卷滚条设置,用来设定滚动条，缺省值是auto yes 表示有，no表示没有，auto表示由浏览器自动设置,当现实区域不够的时候 就会出现滚动条,B窗口，设置了不显示滚动条,查看源码,框架的应用领域,很少用在网站的页面显示中，如果使用，大都也是应用在网站后台管理系统的页面上 可以应用于各种web应用系统的使用界面 观察搜狐首页和一个博客系统的后台页面 体会效果,网站首页,后台页面,嵌入式框架,如同“画中画“电视,Iframe标记，又叫浮动帧标记，你可以用它将一个HTML文档嵌入在一个HTML中显示, ,Iframe标记的使用,格式 :,文件的路径，既可是HTML文件，也可以是文

7、本、ASP等,“画中画”区域的宽度,是否出现滚动条,区域边框的高度,另外，在中还可以添加name=#属性，属性后面的文字将出现在不支持FRAMES的浏览器中,嵌入式框架实例, 登鹳雀楼 白日依山尽，黄河入海流。 欲穷千里目，更上一层楼。 ,我们先创建一个文件名叫a.html文件，其代码如下,查看源码,主页面代码, 嵌入式框架 ,换成如下代码，大家注意效果的变化，体会属性的作用 ,查看源码,Iframe的应用领域,用于在页面上动态的显示其他系统页面的内容 嵌入的页面有更新的话，也会相应的显示出来 将页面数据提交到iframe，可以不让页面刷新 关于这点，大家在学习了后面知识“表单”后，才能深刻体会,总结,框架标记 各窗口尺寸设置 框架边框和各窗口格式