资源描述
单击此处编辑母版标题样式,单击此处编辑母版文本样式,第二级,第三级,第四级,第五级,*,第,7,章 窗口框架,7.1,窗口框架简介,7.2,窗口框架控制,7.3,定义窗口名称,7.4,浮动窗口,上一页,下一页,目 录,结 束,本 节,7.1,窗口框架简介,7.1.1,什么是窗口框架,7.1.2,窗口框架的基本结构,7.1.3,窗口框架的分割方式,上一页,下一页,目 录,结 束,本 节,7.2.1,框架设置标签,frameset,7.2.2,子窗口设置标签,frame,7.2,窗口框架控制,上一页,下一页,目 录,结 束,本 节,7.1.1,什么是窗口框架,窗口框架可用于将窗口画面分割成多个小窗口，且每个小窗口中，可以显示不同的网页，达到在浏览器中同时浏览不同网页的效果。,当将浏览的画面分割成多个窗口后，各窗口将可以扮演不同的功能。因为有时候，希望把网页做成：一个窗口显示的是目录，另一个窗口显示的是所选取的项目内容，这样，目录不变，项目之间的切换就会快多了。本章将解决这个问题，介绍几个新的标签，用它们书写的,HTML,文件不但可以在一个屏幕上开多个窗口，而且可以在每个窗口上显示不同的网页内容。这就是,HTML,中的窗口框架。,上一页,下一页,目 录,结 束,本 节,在介绍窗口框架文档之前，先来看看其应用实例，有一个感性认识，见下图。,7.1.2,窗口框架的基本结构,上一页,下一页,目 录,结 束,本 节,图中的网页做成两个窗口：一个窗口显示的是目录，另一个窗口显示的是所选取的项目内容。,这就是所谓的窗口框架，窗口框架可以生成能独立变化和滚动的窗口，从而能将一个窗口分割为若干个子窗口，在每个子窗口中显示一个,HTML,文档。,例：测试窗口框架文档，效果如上图。,文件,ex7-01.html,的源代码,窗口框架文档,上一页,下一页,目 录,结 束,本 节,现在，再来看看,HTML,是如何实现窗口框架文档的。框架的基本结构，主要利用,标签与,标签来定义。其中,标签用于定义一个窗口框架，,标签则用于定义窗口框架中的子窗口。,实际上，窗口框架文档的书写格式与一般的,HTML,文档的书写格式相同，只是用,代替,标签，,是一个成对标签，有开始和结束标签，在,标签内使用了另一个标签,，用它来指定每一个窗口的内容。,上一页,下一页,目 录,结 束,本 节,窗口框架文档,HTML,的结构如下：,上一页,下一页,目 录,结 束,本 节,7.1.3,窗口框架的分割方式,窗口框架的分割方式可分为两种，一种是水平分割，另一种是垂直分割。至于采用哪种分割方式，则要通过,标签中的,rows,属性（水平分割）和,cols,属性（垂直分割）来设置。,在完成窗口画面的分割后，就要控制每个分割出来的子窗口。控制子窗口的属性需要通过,标签，在,标签最重要的属性为子窗口的名称（,name,属性）与要导入的,HTML,文件的来源（,src,属性）。,上一页,下一页,目 录,结 束,本 节,框架设置标签,标签是成对出现标签，首标签,和尾标签,之间的内容就是使用框架的,HTML,文档主体部分。在使用框架的,HTML,文档中不能出现,标签，否则会导致,web,浏览器忽略所有的框架定义而只显示,和,之间的内容。,标签的作用是将窗口分割为若干个子窗口。,标签主要有,rows,、,cols,、,border,、,bordercolor,和,frameborder,五个属性。,7.2.1,框架设置标签,frameset,上一页,下一页,目 录,结 束,本 节,一、水平,/,垂直分割窗口属性,rows/cols,1,格式：,2,说明：,rows,后面的值，说明窗口横向分隔情况，,cols,后面的值说明纵向分隔说明。,各参数值之间用逗号分隔，依次表示各个子窗口的高度（宽度）。,上一页,下一页,目 录,结 束,本 节,rows,和,cols,可以用数字、百分比或剩余值以及这三种方式的混合来表示：,数字。表示子窗口高度（宽度）所占的像素点数。,百分比“,%”,。表示子窗口高度（宽度）占整个浏览器窗口高度（宽度）的百分比。,剩余值“*”。表示当前所有窗口设定之后的剩余部分。当符号*只出现一次，即其他子窗口的大小都有明确定义时，表示该子窗口的大小将根据浏览器窗口的大小而自动调整。当符号*出现一次以上时，表示按比例分割浏览器窗口的剩余空间。,例如，,表示将浏览器窗口分割为,3,列，第一个子窗口在第一列，窗口宽度为整个浏览器窗口宽度的,40%,；第二个子窗口在第二列，占浏览器窗口剩余空间的,2/3,，即其宽度为整个浏览器窗口宽度的,40%,；第三个子窗口占剩余空间的,1/3,，宽度为整个浏览器窗口宽度的,20%,。,再如在,ex7-1.html,的文件中，设置,cols=179,*,，表示纵向有两个窗口，其中第一个宽度为,179,个像素点，剩余的是第二个窗口；没有,rows,，说明用的是默认值，即横向为一个窗口。,上一页,下一页,目 录,结 束,本 节,二、设置窗口架框宽度属性,border,在,标签中，可运用,border,属性控制分割窗口的框架的宽度，其语法如下所示：,其中的数值代表此窗口框架的宽度，单位为像素。,三、设置边框颜色属性,bordercolor,在,标签中，可运用,bordercolor,属性设置边框的颜色，其语法如下所示：,其中的,#,代表此边框的颜色，取值可为,RGB,代码。,上一页,下一页,目 录,结 束,本 节,四、设置框架隐藏属性,frameborder,frameborder,属性用于控制窗口框架四周，是否显示框架。此属性可使用在,标签与,标签中，使用在,标签内时，可控制窗口框架的所有子窗口。使用在,标签时，则仅能控制该标签所代表的子窗口，其语法为：,0,代表不显示框线，,1,代表显示框线，其默认值为,1,。,上一页,下一页,目 录,结 束,本 节,7.2.2,子窗口设置标签,frame,窗口框架建立起来后，应在各个子窗口内放入相应的信息。子窗口的初始化是用,标签来描述的。屏幕上的每一个子窗口均对应一个,标签。用,标签中的,src,属性链接相应的文件，该文件内容就显示在,标签对应的窗口之中，像在图,7-1,中，,ex7-01-1.html,就放在左边的窗口，,ex7-01-2.html,则放在右边的窗口，其实现的代码片段如下：,是个单向的标签，使用时，将它写在,的开始和结束标签之间，它主要有六个属性：,src,、,name,、,marginwidth,、,marginheight,、,scrolling,和,noresize,。,上一页,下一页,目 录,结 束,本 节,1,指定子窗口显示网页属性,src,src,属性是用于指定要导入到某个子窗口的,HTML,文件的位置，其语法如下所示：,如果一个,标签中没有,src,属性，则该窗口显示为空。,2,定义子窗口名称属性,name,name,属性是用来指定窗口的名称，此属性是可选的。当完成定义子窗口的名称后，我们便可在超链接中，指定显示网页的子窗口。其语法如下所示：,上一页,下一页,目 录,结 束,本 节,3,控制框架滚动条属性,scrolling,scrolling,属性用于描述该窗口是否设有滚动条。该属性是可选的。其设置语法如下：,各设置值所代表的意义依序为显示、不显示、自动设置，默认值是,auto,。,4,子窗口大小的调整属性,noresize,noresize,属性是一个标志，没有取值。它说明浏览者是否可以自行用鼠标调整窗口的大小。如果设定了,noresize,属性，则窗口不能调整。如果默认，则可以自行调整窗口的大小。,上一页,下一页,目 录,结 束,本 节,5,设置边距属性,marginhaeght/marginheight,marginwidth,属性用来控制窗口内显示的内容与窗口左右边缘的距离，该属性是取一个像素值，默认为,1,，该属性是可选的。,marginaheight,属性，用来控制窗口内显示的内容与上下边缘的距离，该属性是取一个像素值，默认为,1,，该属性是可选的。,上一页,下一页,目 录,结 束,本 节,如果窗口中的内容含有高亮度的链接，那么，当鼠标点了这个链接之后，被链接的内容放在哪个窗口呢？我们来认识一个新的属性,targe,，用这个属性就可以将被链接的内容放置到你想要放的窗口内。,7.3,定义窗口名称,上一页,下一页,目 录,结 束,本 节,如在文件,ex7-01.html,中，放置文件的功能是由下面的代码片段实现的：,在文件,ex7-1-1.html,中，放置文件的功能是由下面的代码片段实现的：,1.,春望,2.,春晓,从上述代码可以看出，,ex7-1-1.html,文件的内容将在窗口“,windows1”,（左边窗口）中显示，,ex7-1-2.html,文件的内容将右边窗口显示。,20,上一页,下一页,目 录,结 束,本 节,在,ex7-1-1.html,文件中，当你单击超级链接时，所链接的内容都将在右边窗口显示。,用,target,属性定义窗口的名称，必须使用字母,/,数字字符，否则窗口名将被忽略。但是，有几个特定的窗口名例外，这几个窗口名有特殊含义，它们是,_blank,、,_self,、,_parent,和,_top,。,target=_blank,当将,target,属性设置为,_blank,时，若单击超链接后，将以打开另一窗口的方式显示网页。,target=_self,当将,target,属性设置为,_self,时，则将在同一窗口中显示链接的网页。,target=_parent,当将,target,属性设置为,_parent,时，若单击超链接后，该链接网页将导入目前子窗口的上一层框架。若没有上层，则导入在同一窗口中。,target=_top,当将,target,属性设置为,_top,时，则将脱离目前的窗口框架，在最上层的窗口框架中，显示链接的网页。,21,上一页,下一页,目 录,结 束,本 节,在一个页面中直接引入另一个页面，这种技术称为浮动的窗口（,Floating frame,）。在,HTML,中通过,iframe,标签实现。,其语法如下所示：,其中,#=,初始页面的,URL,。,7.4,浮动窗口,22,
展开阅读全文