用DreamWeaver快速搭建框架页面 梦觉 2001年 30期 #1 什么是框架页面   框架页面是由一组普通的Web页面组成的页面集合,通常在一个框架页面集中,将一些导航性的内容放在一个页面中,而将另一些需要变化的内容放在另一个页面中。使用框架页面的主要原因我想大概是为了使导航更加清晰,使网站的结构更加简单明了。让我们看一下下面的这个网站例子吧(图1)。(^30040704a^)   这个页面是由上中下三部分组成的一个框架页面集,最上面的是此站点的栏目导航,点击不同的栏目,相应的栏目内容会出现在中间的框架子页面中。最下面是此站点的一些相关信息页面导航,点击每个栏目后,信息也会出现在中间的主框架页面中。这样的框架页面组合可以保证整个站点的栏目始终都出现在浏览者的视线中,使浏览者的注意力更多集中在框架页面集的中间部分,即栏目内容上。   #1 如何创建框架页面   下面我开始介绍快速搭建框架结构页面的主要步骤,需要指出的是通往目的地的路千条万条,我只介绍我最常走的路:)在Dreamweaver4中的Object面版中新增了Frames面板,我们可以利用此工具方便快捷地创造我们的框架页面。   我们知道框架结构的页面都是由多个单独得页面组成,因此在制作框架页面之前最好先将组成框架的各个单独的页面建好。首先看一下我们最终的页面(图2):(^30040704b^)   在我们这个实例中将需要三个单独的页面,最顶端的是top.htm页面,下方左边的是导航页面Left.htm,下方右边的是内容页面Main.htm。下面分别介绍创建的具体步骤:   1.在Dreamweaver的站点窗口分别创建三个空的页面,分别命名为:Top.htm、Left.htm、Main.htm。   2.打开Main.htm页面。将Object面板切换到Frames面板(图3);(^30040704c^)   执行菜单Window—Frames打开框架结构面板(图4);(^30040704d^)   执行菜单View—Visual Aids—Frame Borders使得框架结构的边框可见(图5)。(^30040704e^)   3.在Frames工具面板中选择图6所示框架集。(^30040704f^)   在当前的Main页面的顶端合作边分别插入一个相邻的页面,组成我们需要的框架集(图7)。(^30040704g^)   4.指定组成框架集得页面,打开属性面板,分别设定顶端和左边框架页面的实际文件链接地址,其他参数如图8所示;(^30040704h^)   1)Src:设置框架文件的链接地址。   2)FrameName:设置框架文件的名称,此设置非常重要在后面的连接中将用到。   3)Scroll:设定是否允许滚动条出现,顶端最好设定为No,左端最好设定为Auto。   4)No Resize:可以指定是否允许改变框架集各页面的窗口大小。   分别指定顶端页面链接文件的地址为Top.htm,左端页面链接文件的地址为Left.htm。   5.改变框架集页面大小。在框架面板中选定上下框架集边框,设定顶端框架页面的高度(图9);(^30040704i^)   接下来用鼠标选定下方的框架集,再在属性面板中设定左边框架的宽度(图10);(^30040704j^)   6.基本的框架页面组成就设定完了,执行菜单命令File—Save Frameset As保存框架集页面为Frames.htm。下面我们需要在各个页面之间搭起沟通的桥梁—加入链接。   #1 框架页面应用之不同页面实现互相链接   我们知道框架页面的主要用途就是用于导航,浏览者点击一个链接时,相关的内容页会在另一个框架中显示出来,这其实就是为链接指定了一个目标框架窗口。用前面我们定义的框架的名称属性,我们可以将组成框架的任意一个部分甚至整个框架作为目标窗口。要指定一个到指定框架的链接,可以按照如下步骤进行:   1.选择链接文字或图片,这里我们选择最顶端的“About Me”文字。   2.在链接地址中(Link),输入相应的地址About.htm。在Target下拉框选择需要的窗口名称(图11);(^30040704k^)   这里显示的是当前页面所包含的窗口以及Dreamweaver预设的四个窗口名称,   _blank:此选项为点击链接,打开一下新窗口。   _parent:此选项为点击窗口链接在当前窗口的上一级窗口打开。   _self:此选项将使链接在本身所在的窗口打开。   _top:此选项为点击链接窗口在整个框架集的最外端窗口打开。   mainFrame:我们前面为右边窗口设定的名称,选择此项文档将在此窗口中打开。   leftFrame:我们前面为左边窗口设定的名称。   topFrame:我们前面为顶端窗口设定的名称。   3.本例中我们为上面的导航栏目设定的目标框架窗口都为mainFrame,点击About栏目时,相应的栏目内容将在右下方的mainFrame窗口打开。   #1 框架页面应用之同时更新多个页面    有时我们需要在点击一个栏目时同时更新另外的两个或多个框架页面内容,这可以通过以下步骤使用Dreamweaver的行为来实现。   1.选择链接的文字或图片。   2.打开行为面板(Behaviors),点击加号添加Go to URL行为(图12)。(^30040704l^)   3.在Go to URL对话框中显示了当前已有的所有框架窗口,分别选定一个窗口名称,可以分别单独设定每个窗口将要更新的文件内容。Dreamweaver会在设定了目标文件的窗口后面加一个“*”号,表示此框架窗口已设定了URL(图13)。(^30040704m^)   4.完成后,点击确定即可,我们点击此链接,会同时更新多个窗口的内容。   由于目前框架结构已得到了大多数浏览器的支持,因此它正变得越来越普遍。但相对来说,框架结构要比普通页面难于控制和制作,很多细节问题需要你反复的调整和实践,这里无法一一详细介绍,希望我的介绍能帮助你开始实践框架结构的页面。记住,任何的付出都会有所收获的。