用表格和框架布局网

单击此处编辑母版标题样式,单击此处编辑母版文本样式,桂林电子科技大学信息科技学院信息工程系,第,9,章 用表格和框架布局网页,本章知识技能要点,表格在网页中的作用,表格的创建与编辑,利用表格对页面进行布局,利用布局模式对页面进行布局,Dreamweaver8,中框架的创建方法,超链接框架目标的指定,框架和框架页的基本操作,9.1,网页中的表格,9.1,网页中的表格,常见操作：,在网页中插入表格,向表格中添加数据,导入外部数据,表格的编辑与修改,9.1,网页中的表格,表格大小相关设定,设定页首的位置,设定附加功能,9.1,网页中的表格,将,EXCEL,文件导入,DW,数据窗口的方法：,导入的电子表格请符合下面的三种情况,1.,是从本系统导出的模板,2.,在,excel,另存为,csv,(,逗号分隔,),类型的文件；,3.,在,excel,另存为文本文件,(,制表符分隔,即,tab,分隔,),类型的文件,选择“文件”菜单“导入”“表格式数据”命令，或者选择“插入”菜单“表格对象”“导入表格式数据”命令，弹出“导入表格式数据”对话框，指定要导入的数据文件、定界符及其他选项。,定界符：设定界线的符号,9.2,布局模式,单击“插入”栏“布局”类中的“布局模式”按钮，进入布局模式。,9.3,框架网页的制作,框架网页的作用是将数个网页同时集中在同一个网页呈现，也称为框架集,(Frameset),网页。,9.3.1,框架的基本概念,parisdiary.htm,parisdiarymain.htm,parisdiarytopmenu.htm,parisdiaryleftmenu.htm,9.3,框架网页的制作,以,ch9,文件夹中,ch-08,文件夹的素材为例。,可先建立一个名为,paris,的站点。,一、分割框架,9.3.2,框架网站的制作,9.3,框架网页的制作,1,、在站点,paris,中新建页面,parisdiary.htm,，将框架一分为三。,9.3,框架网页的制作,关于每个框架的命名：,这里，,左框架名为：,leftFrame,，上框架名为：,topFrame,，右框架名为：,mainFrame,。,注：可以通过框架属性面板对框架重新命名。,9.3,框架网页的制作,2,、设置框架属性,9.3,框架网页的制作,常用设置方法：,单击框架面板中框架的边框，选择框架集，然后在属性检查器中设置此框架集的属性。,（可参考,网页制作教程,P157,）选择“窗口”菜单“框架”，可弹出“框架”面板,以设置右边框为例：,9.3,框架网页的制作,二、指定各框架的框架内容,以设置左侧框架为例：,左侧设置完成后的效果,topFrame,的链接为：,parisdiarytopmenu.htm,mainFrame,的链接为：,parisdiarymain.htm,9.3,框架网页的制作,三、指定链接框架,未调整前的预览效果,9.3,框架网页的制作,9.3,框架网页的制作,四、保存框架组,9.3,框架网页的制作,课堂练习,9-1,要求用表格布局分别实现,网页设计与制作教程,P235,第,1,题和第,2,题的页面效果，相应的图片素材和效果等资料分别位于,exercisech9-1,中的,ch9-1-1,和,ch9-1-2,文件夹。,（注：对于第,1,题，考虑能否用,DW,的网站相册功能实现相应的图片显示效果）,课堂练习,9-2,使用,exercisech9-2,中的文件和素材，要求用框架布局的方法制作,coco-,index.htm,，其它如下：,相应图标的链接：,第一篇,第二篇,第三篇,