资源描述
第三级,单击此处编辑母版标题样式,第,10,章 网页框架,Frame,在网页中，一个网页可以包含多个页面，此时需要用到框架。使用框架可以进行页面布局，把网页化分为几个区域。例如，一个水平框架用于放置Banner（也就是标题）；左垂直框架用于放置导航；右垂直框架用于放置正文。每一个框架单独使用一个网页，从而使页面设计简单化。框架除了用于页面布局，还可用于制作目录。包含框架的网页称为框架集。框架集定义了各个框架的结构、数量、大小和目标等属性。本章将介绍框架的使用方法。,10.1创建框,架,架,一个完,整,整的框,架,架页面,应,应该包,括,括两个,部,部分：,框,框架和,框,框架集,。,。前面,介,介绍了,框,框架集,的,的作用,，,，它用,来,来定义,框,框架的,各,各种属,性,性。在,网,网页中,框,框架集,是,是不可,见,见的，,显,显示出,来,来的只,是,是各个,框,框架。,框,框架集,本,本身是,一,一个网,页,页再加,上,上框架,的,的目标,页,页面，,所,所以一,个,个完整,的,的框架,集,集包含,有,有多个,页,页面。,10.1.1自定义,框,框架,在创建,自,自定义,框,框架之,前,前，首,先,先确定,是,是否打,开,开框架,可,可视元,素,素。如,果,果没有,，,，需要,按,按照以,下,下步骤,进,进行操,作,作：单,击,击【查看】|【可视化,助,助理】|【框架边,框,框】命令，,使,使其处,于,于选中,状,状态。,此,此时，,页,页面中,可,可以显,示,示框架,边,边框。,创,创建自,定,定义框,架,架的具,体,体步骤,如,如下：,自定义,左,左右框,架,架效果自定义,上,上下框,架,架效果,10.1.2预定义,框,框架,在DreamweaverCS3中，系,统,统预定,义,义了13种框架,类,类型。,通,通过插,入,入栏中【布局】标签的,框,框架按,钮,钮，可,以,以为页,面,面设置,框,框架，,具,具体步,骤,骤如下,：,：,框架子,菜,菜单【框架标,签,签辅助,功,功能属,性,性】对话框,10.1.2预定义,框,框架,单击【,确,确定】,按,按钮，,完,完成创,建,建预定,义,义框架,，,，效果,如,如图左,所,所示。,按,按照以,上,上步骤,，,，可以,创,创建其,他,他类型,框,框架，,如,如左侧,和,和嵌套,的,的顶部,框,框架，,效,效果如,图,图右所,示,示。,顶部和,嵌,嵌套的,左,左侧框,架,架效果,左,左侧和,嵌,嵌套的,顶,顶部框,架,架效果,10.1.3自定义,嵌,嵌套框,架,架,前面介,绍,绍了框,架,架的创,建,建方法,，,，使用,系,系统预,定,定义的,方,方法可,以,以快速,创,创建出,复,复杂的,框,框架。,但,但是预,定,定义框,架,架有时,并,并不能,完,完全满,足,足需要,，,，此时,需,需要创,建,建自定,义,义框架,。,。框架,像,像表格,一,一样可,以,以多重,嵌,嵌套，,具,具体步,骤,骤如下,：,：,下框架,嵌,嵌套框,架,架效果多重嵌,套,套框架,效,效果,10.2框架源,码,码,前一小,节,节介绍,如,如何创,建,建框架,集,集和框,架,架，接,下,下来查,看,看构成,框,框架的,源,源码会,有,有怎样,的,的变化,。,。本小,节,节将介,绍,绍框架,源,源码，,以,以10.1.3小节的,实,实例进,行,行讲解,，,，打开,实,实例框,架,架集.从源码,中,中可以,看,看出，,网,网页中,有,有两个,陌,陌生的,标,标签,和,和。,其,其中,标,标签用,于,于设置,框,框架集,，,，标,签,签用于,设,设置框,架,架。这,些,些标签,都,都是成,对,对出现,，,，如果,不,不结束,标,标签可,能,能会造,成,成页面,混,混乱。,标签,包,包含rows,和,和cols两,个,个属性,，,，这两,个,个属性,分,分别用,于,于设置,水,水平拆,分,分和垂,直,直拆分,框,框架，,还,还用于,设,设置框,架,架的尺,寸,寸。,10.2框架源,码,码,标签,有,有多个,属,属性，,其,其使用,语,语法如,表,表。,（,（续表,）,）,10.3调整框,架,架,前面了,解,解了如,何,何创建,框,框架。,新,新创建,的,的框架,需,需要进,行,行一些,调,调整才,能,能符合,设,设计的,要,要求，,如,如框架,结,结构、,尺,尺寸大,小,小和数,量,量等。,在,在实际,应,应用中,，,，还需,要,要对框,架,架集及,其,其属性,进,进行修,改,改。本,节,节将介,绍,绍如何,调,调整框,架,架以适,合,合需要,。,。,10.3.1选择框,架,架,修改对,象,象属性,时,时首先,选,选中对,象,象。对,框,框架集,或,或框架,进,进行修,改,改时，,首,首先选,中,中框架,对,对象。,选,选中框,架,架集时,，,，其所,有,有框架,边,边框显,示,示出虚,线,线，表,示,示该框,架,架处于,选,选中状,态,态。同,样,样当框,架,架选中,时,时，也,会,会显示,虚,虚线，,表,表示选,中,中，效,果,果如图10.9所示。,【框架】面板,嵌,嵌套框,架,架效果,10.3.1选择框,架,架,选中一,个,个框架,后,后，可,以,以结合Alt,键,键和方,向,向键进,行,行框架,选,选择的,切,切换,。,。,选中第,一,一层框,架,架集效,果,果,选,选中最,右,右下方,框,框架效,果,果,10.3.2保存框,架,架,设计好,框,框架页,面,面后，,要,要保存,框,框架。,因,因为框,架,架页面,包,包含了,多,多个网,页,页，所,以,以保存,时,时与普,通,通页面,不,不一样,。,。在DreamweaverCS3中可以,保,保存一,个,个框架,集,集，也,可,可以单,独,独保存,一,一个框,架,架，还,可,可以保,存,存所有,的,的框架,集,集及框,架,架。最,快,快捷的,方,方式是,保,保存框,架,架集。,保,保存框,架,架集的,具,具体步,骤,骤如下,：,：,单击框,架,架边框,选,选中框,架,架集。,单击【文件】|【框架集,另,另存为】命令，,弹,弹出【另存为】对话框,。,。输入,路,路径及,名,名称，,单,单击【确定】按钮。,如果框,架,架集已,经,经保存,过,过，单,击,击【文件】|【保存框,架,架集】命令。,10.3.3设置框,架,架集,插入框,架,架集后,，,，需要,对,对框架,集,集进行,一,一些设,置,置，如,边,边框架,有,有无、,大,大小和,颜,颜色等,。,。在DreamweaverCS3中，可,通,通过框,架,架集的【属性】面板进,行,行设置,。,。框架,集,集的【属性】面板如,图,图所示,。,。,边框集,属,属性设,置,置效果预览效,果,果,10.3.4设置框,架,架,设置框,架,架集后,，,，同样,也,也需要,设,设置框,架,架的属,性,性。例,如,如，设,置,置框架,的,的名称,、,、尺寸,大,大小、,边,边框和,滚,滚动条,等,等属性,。,。接着上,一,一小节,中,中的实,例,例设置,框,框架属,性,性，具,体,体步骤,如,如下：,框架滚,动,动条效,果,果,框,框,架,架属性,设,设置效,果,果,10.3.5命名框,架,架集页,面,面,在DreamweaverCS3中，不,能,能通过【属性】面板进,行,行命名,，,，而是,通,通过设,计,计视图,工,工具栏,和,和页面,属,属性来,进,进行设,置,置。设,计,计视图,工,工具栏,设,设置的,具,具体步,骤,骤如下,：,：,设计视,图,图工具,栏,栏,框架集,标,标题效,果,果,10.3.6修改框,架,架尺寸,前面介,绍,绍通过【属性】面板可,以,以修改,框,框架的,尺,尺寸，,还,还可通,过,过拖动,鼠,鼠标进,行,行框架,的,的大小,修,修改，,具,具体步,骤,骤如下,：,：,调整框,架,架尺寸,10.3.7使用无,框,框架内,容,容,当浏览,器,器不支,持,持框架,元,元素时,，,，可以,设,设置提,示,示信息,，,，告诉,浏,浏览者,浏,浏览的,页,页面不,能,能正常,显,显示。,此,此时通,过,过编辑,无,无框架,内,内容来,提,提示浏,览,览者，,具,具体步,骤,骤如下,：,：,编辑无,框,框架内,容,容,10.4设置框,架,架链接,在框架,中,中可以,使,使用链,接,接来控,制,制框架,内,内容，,把,把链接,的,的目标,定,定位在,指,指定的,框,框架。,例,例如，,电,电子书,类,类网页,的,的左框,架,架用于,放,放置目,录,录等导,航,航信息,，,，右框,架,架用于,放,放置主,体,体内容,。,。此时,需,需要把,右,右框架,设,设置为,主,主框架,（,（main_frame），当,单,单击目,录,录导航,时,时，链,接,接内容,即,即可显,示,示在主,框,框架内,，,，具体,步,步骤如,下,下：,10.4设置框,架,架链接,按F12键预,览,览网页,，,，效果,如,如图左,所,所示。,选,选择【,目,目录三,】,】选项,，,，右边,出,出现“,目,目录三,的,的内容,”,”，如,图,图右所,示,示。,框架链,接,接效果改变框,架,架链接,效,效果,10.5使用浮,动,动框架iframe,浮动框,架,架比普,通,通框架,要,要灵活,，,，它可,以,以像层,一,一样在,网,网页中,放,放置。,浮,浮动框,架,架结合,脚,脚本程,序,序可制,作,作出页,面,面的局,部,部更新,。,。在此,将,将介绍,浮,浮动框,架,架的基,本,本用法,10.5使用浮,动,动框架iframe,在DreamweaverCS3中不,能,能在【,属,属性】,面,面板中,设,设置iframe，,只,只能手,动,动进行,修,修改源,码,码。将,前,前面的,源,源码复,制,制到网,页,页的,标签,之,之间，,预,预览效,果,果如图,所,所示。,iframe效果,10.6专家总,结,结,本章介,绍,绍了框,架,架的基,本,本概念,。,。读者,可,可以学,习,习如何,创,创建框,架,架、设,置,置框架,大,大小和,框,框架命,名,名等基,本,本操作,。,。在使,用,用框架,的,的过程,中,中，注,意,意要理,解,解框架,的,的基本,概,概念和,结,结构，,以,以及框,架,架的嵌,套,套关系,。,。通过,框,框架可,以,以用来,制,制作电,子,子书和,导,导航效,果,果。,在框架,的,的学习,过,过程中,，,，框架,集,集与框,架,架之间,的,的关系,较,较难理,解,解。另,外,外，浮,动,动框架iframe一般情,况,况下使,用,用较少,，,，本章,只,只简单,进,进行介,绍,绍。如,需,需要深,入,入了解,，,，读者,可,可参阅,其,其他资,料,料。本,章,章内容,读,读者须,在,在使用,的,的过程,中,中边思,考,考边实,践,践，才,能,能熟练,掌,掌握。,
展开阅读全文