关于网站的窗口分割,框架结构

1. 框架结构(Frame)

  窗口分割技术(Frames)可以让浏览器同时显示多个窗口,每个窗口显示不同的文件内容。让读者同时浏览多个HTML文件,并能在不同画面之间方便地切换。就好似多画面电视机一样。

    利用窗口分割技术划分出的每一个区域称为Frame,它的原意是框架,就好似在屏幕上挂上几个独立的像框。

    Frames结构的文件的结构与一般的HTML文件大致相似,只是将HTML的文件主体标签BODY改成FRAMESET。

    典型的FRAMES结构如下:

    <html>

         <head><title>标题</title></head>

         <frameset>各常窗口内容</frameset>

    </html>

    从这种结构可以看出,凡是普通HTML文件中BODY的内容都纳入FRAMESET之内。也就是说,在同一份HTML文件中,使用了FRAMESET元素就不能使用BODY元素,两者不能同时出现。

    每一个Frame都有以下几点特性:

    1)可指定一个对应的URL地址,同一版面的各框架都能分别独立地载入资料。

  2)可指定框架名称,作为其它URL所指向的目标。

    3)可设置成能卷动的大小可变的动态框架,也可设置成大小固定不变的静态框架。

2. 设置框架(FRAMESET)

    标签<FRAMESET></FRAMESET>用于设置多个显示窗口,它的属性参数有两个:

    1)ROWS= 

    定义将窗口按上下划分的个数和各部分的高度大小比例。

    例9-1 <frameset rows=100,200,300>

    表示将窗口分成三部分,各部分高度分别为100,200,300个像素点。

    2)COLS= 

    定义将窗口按左右划分的个数和各部分的宽度比例。

    例9-2 <frameset cols=300,200>

   表示将窗口左右分成两部分,各部分高度分别为300,200个像素点。

    注意: 一个frameset标签中,Rows和Cols参数只能出现一个,不能同时出现.

    Rows和cols参数的值除用像素点外,还可以用百分比相对值。

    例9-3<frameset rows=30%,70%>

    表示将窗口上下分割成两部分,各占高度的30%和70%。如果百分比总数不足或者超过100%,不足或超过部分会平均分配给每一个框架。

    *号也能表示rows或cols的值。它表示各框架大小相等的因子。

    例9-4 <frameset cols=200,*,*>

    表示左右分成三部分,第一部分宽200像素点,第二、第三部分各占其余宽度的一半。

    例9-5<frameset rows=*,2*,3*>

    表示将窗口上下分割成三部分,其高度比例为1:2:3。

3. 框架内容标签(FRAME)

    <FRAME >标签定义框架的具体内容。 <FRAME>常用的参数有:

    1)框架内容参数 SRC=

    用于指定在窗口内显示的内容。通常用URL地址表示。SRC是frame必要的参数,如果不定义,则框架将无内容。

    2)框架命名参数 NAME=

    用于给某一框架命名。

    例9-6 <FRAME src="LEFT.HTML" NAME="LEFT1">

     给左侧窗口取名"LEFT1"。它的显示内容是一个名为“LEFT.HTM的文件。其它的窗口用类似的方法取上名字,供其它地方调用。以后就可以方便地指定某一个LINK的目的地址出现在窗口上。这种用法与<A NAME="***">的作用类似。

    3)框架边界宽度:MARGINHEIGHT=和MARGINWIDTH=

    左右分割的框架,边界宽度用MARGINWIDTH=定义,上下分割的框架,边界宽度用MARGINHEIGHT= 定义。它们的单位都为像素点。

    如果不设置边界宽度,则由浏览器自己确定。

    4)设置框架卷动条:SCROLLING=

    卷动条可为横、纵坐标同时设置,它的值有三种:yes、no、和auto, 默认值为auto.表示有浏览器自动确定是否显示卷动条。

    5)框架的框边可否变动参数:NORESIZE

    框架的大小在浏览时,是可以变更的。这可由用户用鼠标点住边框,再拖动鼠标进行任意调整。但如果在frame标签中加了MORESIZE属性,则框架的大小便固定不变了。

4.表格式框架

  Frameset不能同时带有rows和cols两种属性参数,这就是说,它只能沿一个方向分割窗口。即要么上下分割,要么左右分割。能否将窗口同时沿上下左右分割,而形成表格式的框架结构呢?

    回答是肯定的。嵌套使用FRAMESET标签就可以了。

    例9-7,要将窗口上下分割成两等分,上半部分分割成左右两部分,大小比例为30%,70%。下半部分分割成三等分,可以使用下列标签实现:

    <frameset rows=50%,50%>

         <frameset cols=30%,70%></frameset>

         <frameset cols=*,*,*></frameset>

    </frameset>

    第一行,将屏幕上下分割,第二、三行为子框架(subframe)。第二行将上半部左右分割成两部分,第三行将下半部分左右分割成三等分。第四行为外层frameset的结束。

5.适应不支持框架的浏览器 <NOFRAME>

    有许多低版本浏览器不支持框架结构的HTML文件,框架结构的HTML文件在这类浏览器中的显示会变得一蹋糊涂,或者根本无显示。为了顾全使用不支持FRAME浏览器的用户,可以通过NOFRAME标签,将要显示的内容放在NOFRAME标签以内,当这类用户浏览时,FRAME标记被忽略,但<NOFRAME>里面的内容会正常显示,只是无分割的窗口。当用了支持FRAME的浏览器时,<NOFRAME>标记被忽略,<FRAME>里面的内容会正常显示在分割的窗口中。

 

   下面是一个完整的例子:

    例9-7Frame实例(本例只能在高于Netscape 2.0的版本上才能显示分割的窗口.)

<html>

     <head><title>FRAME实例</title></head>

          <frameset rows="50%,50%" >

                 <frameset cols="30%,70%">

                   <frame src="left1.htm" name="left1" noresize>

                   <frame src="right1.htm" name="right1" >

                 </frameset>

                 <frameset cols="35%,65%">

                      <frame src="left2.htm" name="left2" >

                      <frame src="right2.htm" name="right2" scrolling=no>

             </frameset>

         </frameset>        

         <noframe>

           <center>

          <H3>当你使用不支持FRAME的浏览器时,<BR>

              将只能看到本信息!!<H3>

          </center>

        <noframe>

 </html>

    将浏览器窗口分割成四部分:分别命名为:left1,right1,left2和right2。这四个窗口的显示内容为四个HTML文件:left1.htm、right1.htm、left2.htm、right2.htm,它们的源代码如下:

    left1.htm:

    <html><head><title>框架left1</title></head>

       <body><h2>框架left1的显示内容</h2></body></html>

   

right1.htm:

    <html><head><title>框架right1</title></head>

         <body><h2>框架right1的显示内容</h2></body></html>

 

    left2.htm:

    <html><head><title>框架left2</title></head>

         <body><h2>框架left2的显示内容</h2></body></html>

 

    left1.htm:

    <html><head><title>框架right2</title></head>

         <body><h2>框架right2的显示内容</h2></body></html>

 

    在浏览器中显示情况如图9.1所示。

   

9.1Frame实例显示

从图中看出:

    1)每个框架相当于一个完整的浏览窗口。

    2)由于left1设置了noresize参数,它的大小就不能通过拖动鼠标调整。从而影响上下两部分的边界也不能变动,left2和right2的相对大小则可以任意调整。

    3)当一个框架的内容不能全部显示时,卷动条出现,提示用户通过拖动卷动条显示其余内容。当某方向内容能完全显示时,卷动条不出现(如letf1的水平方向)。如果某一框架设置了参数:

    SCROLLING=“NO”

    卷动条也不会出现(right2)。

    4)本例中有一部分内容是包围在NOFRAME标签之内的。这部分内容在图9.1中不显示出来。但若用不支持FRAME结构的浏览器,则只能看到此部分,而不能看到被分割了的窗口。

6.Frames结构的应用

    利用框架结构能将窗口分割成各自独立的部分,我们可以设计出一些很有特色的HTML文件来。

    其中一种思路是:将读者需要经常看到的画面,如目录、控制按钮、主题标志、版权声明、作者地址等放在一个静态框架里,不随画面卷动。使得读者能随时方便地查询。

    相对于静态框架的是另一部分动态框架,用来显示供浏览的大量信息内容。读者在浏览的同时,能随时从静态框架里找到目录或者控制按钮,随心所欲地跳跃切换。大大提高查询效率。 

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值