第9章 用表格与框架布局网页.pptVIP

第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 框架网页的制作 以ch9文件夹中ch-08文件夹的素材为例。 可先建立一个名为paris的站点。 一、分割框架 9.3 框架网页的制作 1、在站点paris中新建页面parisdiary.htm，将框架一分为三。 9.3 框架网页的制作 关于每个框架的命名： 这里， 左框架名为：leftFrame，上框架名为：topFrame，右框架名为：mainFrame。 注：可以通过框架属性面板对框架重新命名。 9.3 框架网页的制作 2、设置框架属性 9.3 框架网页的制作 常用设置方法：单击框架面板中框架的边框，选择框架集，然后在属性检查器中设置此框架集的属性。 （可参考《网页制作教程》P157）选择“窗口”菜单→“框架”，可弹出“框架”面板 以设置右边框为例： 9.3 框架网页的制作 二、指定各框架的框架内容 以设置左侧框架为例： 9.3 框架网页的制作 三、指定链接框架 9.3 框架网页的制作 9.3 框架网页的制作 四、保存框架组 9.3 框架网页的制作 课堂练习9-1 要求用表格布局分别实现《网页设计与制作教程》 P235第1题和第2题的页面效果，相应的图片素材和效果等资料分别位于exercise\ch9-1中的ch9-1-1和ch9-1-2文件夹。 （注：对于第1题，考虑能否用DW的网站相册功能实现相应的图片显示效果） 课堂练习9-2 使用exercise\ch9-2中的文件和素材，要求用框架布局的方法制作coco-index.htm，其它如下： 桂林电子科技大学信息科技学院信息工程系 桂林电子科技大学信息科技学院信息工程系 表格大小相关设定 设定页首的位置 设定附加功能 定界符：设定界线的符号 9.3.1 框架的基本概念 parisdiary.htm parisdiarymain.htm parisdiarytopmenu.htm parisdiaryleftmenu.htm 9.3.2 框架网站的制作 左侧设置完成后的效果 topFrame的链接为：parisdiarytopmenu.htm mainFrame的链接为：parisdiarymain.htm 未调整前的预览效果 相应图标的链接： 第一篇 coco-1.htm 第二篇 coco-2.htm 第三篇 coco-3.htm 桂林电子科技大学信息科技学院信息工程系