HTML教程4.pptVIP

第四章 框架与浮动窗口 知识要点 HTML页面的框架 浮动窗口的使用 体验 带有框架和浮动窗口的综合页面 框架 理解： 框架页面把浏览器窗口切割成几个独立的部分，打开的链接目标文件只占用浏览器窗口的某个区域，该区域就是框架网页的目标框架。框架页面的出现，使得访问者在浏览器窗口中可同时观察多个页面。 本章要点 框架标记 各窗口尺寸设置 各窗口间相互操作(Frame Target) Frame的外观 框架标记 设计框架页面时，Frame标记和Frameset标记用于定义框架网页的结构 各窗口尺寸设置 我们可以将窗口分割为几块，横向分用ROWS属性，纵向分用COLS属性，每一块的大小可以由这两个属性的值来实现 举例说明 首先我们先创建3个html文件，其文件名分别为“a.html、b.html、c.html” 横向排列多个窗口 纵向排列多个窗口 混合排列多个窗口 各窗口间相互操作(Frame Target) 由Frames分出来的几个窗口的内容并不是静止不变的，往往一个窗口的内容随着另一个窗口的要求而不断变化 我们必须为每一个窗口起一个名字，这个名字用属性Name来定义 窗口标识(Frame Name) : 格式： Target属性 Frame的外观 1．各窗口边框的设置 2．边框色彩 3．设置各窗口的上下左右边界宽度 4．各窗口间空白区域的设置 5．卷滚条设置 6．不可变动的框边 frame常用属性 属 性描 述 Src 指示加载的url文件的地址 Bordercolor 设置边框颜色 Frameborder 指示是否要边框,1显示边框，0不显示（不提倡用 yes 或 no） Border 设置边框粗细 Name 指示框架名称,是连结标记的 target所要的参数 Noresize 指示不能调整窗口的大小,省略此项时就可调整, Scorlling 指示是否要滚动条,auto根据需要自动出现,Yes有,No无 Marginwidth 设置内容与窗口左右边缘的距离，默认为1 Marginheight 设置内容与窗口上下边缘的边距，默认为1 Width 框窗的宽及高 默认为width=100 height=100 Align 可选值为 left, right, top, middle, bottom 各窗口边框的设置 边框色彩 设置各窗口的上下左右边界宽度 各窗口间空白区域的设置 卷滚条设置 浮动窗口 Iframe标记，又叫浮动帧标记，你可以用它将一个HTML文档嵌入在一个HTML中显示 Iframe标记的使用 格式 : 浮动窗口实例 我们先创建一个文件名叫a.html文件，其代码如下： 主页面代码 Html Head Title 浮动窗口 /Title /Head Iframe src=a.html /iframe /Html 设置浮动窗口区域的宽与高 Html Head Title 浮动窗口 /Title /Head Iframe src=a.html width=250 height=200 /iframe /Html 设置浮动窗口区域边框 Html Head Title 浮动窗口 /Title /Head Iframe src= a.html width=250 height=200 frameborder=0 /iframe /Html * * 这样的页面是不是很漂亮？我们还可以为其添加一些浮动窗口，实现“画中画”的功能。 由于框架网页的出现，从根本上改变了HTML文档的传统结构,因此在出现Frameset标记的文档中，将不再使用Body标记 基本结构 Html Head /Head Frameset Frame src=url /Frameset /Html FRAMESET是用来划分框窗，每一窗框由一个FRAME标记所标示，FRAME必须在FRAMESET范围中使用 例如： frameset cols=# 　 frameset cols=100，200，300 frameset rows=# 　 frameset rows=10%，20%，70% 其中的任何一个数字也可以由“*”来代替 如：frameset cols=100，200，* 　　frameset cols=100，*，* 　　将100像素以外的窗口平均分配 　　frameset cols=*，*，* 　　　将窗口分为三等份 s a.html Html Head Title A /Title /Head Body h1 align=center A /h1 /Body /Html b.