1、 活动主题活动主题 搜集了大量素材后搜集了大量素材后, ,该通过何该通过何 种方式向人们展现多姿多彩的民种方式向人们展现多姿多彩的民 族文化呢族文化呢? ?每个民族都有不同的历每个民族都有不同的历 史、文化、传统、习俗史、文化、传统、习俗, ,是否可以是否可以 用统一的形式把它们集中表现呢?用统一的形式把它们集中表现呢? 一起动手吧一起动手吧, ,让我们搭建起一个让我们搭建起一个 “民族大家庭”“民族大家庭” ! ! 本节课,我们不仅要学习如何运用表格去设计本节课,我们不仅要学习如何运用表格去设计 页面的布局页面的布局, ,练习使用网页框架练习使用网页框架, ,还要规划页面的数还要规划页面的数
2、 量和链接关系。量和链接关系。 学习体验学习体验 我们在浏览器中看起来浑然一体的网页内容我们在浏览器中看起来浑然一体的网页内容, ,在在 FrontPageFrontPage里却大有“玄机”。里却大有“玄机”。 观察观察 你从图你从图3 3- -1 1、图、图3 3- -2 2发现了什么发现了什么? ? 看看, ,是表格把页面布局好的。只不过因为表格的边是表格把页面布局好的。只不过因为表格的边 框线被隐藏起来了框线被隐藏起来了, ,所以在浏览器中我们没有发现。所以在浏览器中我们没有发现。 一、利用表格设计页面布局一、利用表格设计页面布局 实践实践 1.1.先选择一种“表格布局”先选择一种“表格
3、布局” , ,如图如图3 3- -3 3所示。所示。 相关链接相关链接 “表格”菜单中的“布局表格和单元格”可以助你“表格”菜单中的“布局表格和单元格”可以助你 一臂之力。如果想亲自动手,也可以利用“表格”一臂之力。如果想亲自动手,也可以利用“表格” 菜单的其他选项帮忙。菜单的其他选项帮忙。 2 2. .利用“表格”菜单中的“插入表格”选项在单元利用“表格”菜单中的“插入表格”选项在单元 格中插入其他的表格格中插入其他的表格, ,如图如图3 3- -4 4所示。所示。 3 3. .规划好的网页布局效果如图规划好的网页布局效果如图3 3- -5 5所示。你是否发所示。你是否发 现其实表格的世界也
4、很精彩现其实表格的世界也很精彩? ? 表格提示框 间距 边 框 设置表格属性 创建表格(插入创建表格(插入 / 表格)表格) 选定表格选定表格 编辑表格编辑表格 表格嵌套表格嵌套 为表格添加内容为表格添加内容 表格格式化表格格式化 表格排序表格排序 表格基本操作 二、利用框架设计网页布局二、利用框架设计网页布局 (一(一) )认识框架认识框架 除了表格除了表格, ,框架也是一个网页布局设置的好工具。框架也是一个网页布局设置的好工具。 框架可以把浏览器窗口分成几个独立的区域框架可以把浏览器窗口分成几个独立的区域, ,每个每个 区域可以显示不同的页面区域可以显示不同的页面, ,而页面的内容是互相联
5、而页面的内容是互相联 系的。如图系的。如图3 3- -6 6所示所示, ,这是一个三框架的网页这是一个三框架的网页, ,上面、上面、 左面和右面的框架都放着一个单独的网页。左面和右面的框架都放着一个单独的网页。 ( (二二) )建立框架网页建立框架网页 1.1.选择“文件”菜单中的“新建”选择“文件”菜单中的“新建” , ,在新建面板中在新建面板中 选择“其实他网页模板”选择“其实他网页模板”, ,如图如图3 3- -7 7所示。所示。 2 2、在“框架网页”分页框中选择恰当的网页模板、在“框架网页”分页框中选择恰当的网页模板, , 如图如图3 3- -8 8所示。所示。 3 3. .在划分好
6、的区域中新建网页在划分好的区域中新建网页, ,如图如图3 3- -9 9所示。所示。 4 4. .保存的时候保存的时候, ,根据提示保存不同的页面根据提示保存不同的页面, ,如图如图3 3- -1010 所示。所示。 5 5. .按框架网页的位置命名保存好按框架网页的位置命名保存好, ,如图如图3 3- -1111所示。所示。 创建框架 示 例 框架边框分割线 topFrame mainFrame leftFrame 具有一个上方固定、左侧嵌套的3个框架结构的框架集。 由于在框架集中的每个框架都是一个独立的页面, 所以一个框架集可以包含若干个文档文件,创建好 框架集后需要将每个框架保存成一个个
7、独立的 HTML文件和一个框架集文件(通常为index.html 或index.htm)。然后就可以在这些独立的文件中 创建页面内容了。 Dreamweaver提供了多种保存框架页面的相关 命令,随着用户当前的状态丌同,给出的保存命令 也有所丌同。在执行保存命令之前,首先要选中要 保存的对象。 通常,一个框架集具有 n+1个文件。 保存框架 输入框架文件名 提示保存的框架 示 例 框架集建立后,就可以往各个框架的区域存 放内容了。 只要在文档窗口中的任意一个框架里单击一 下就可置当前插入点为该框架内,然后就可以象 编辑一般的页面一样,插入各种各样的文本、图 片等网页元素。 当然,也可以直接打开
8、某个框架文件独立进 行页面编辑制作。 添加内容 设置框架或框架集属性 要注意要注意, ,在框架网页中在框架网页中, ,框架的每一个部分就是一个框架的每一个部分就是一个 单独的网页文件单独的网页文件, ,在保存时要注意命名在保存时要注意命名, ,以方便我们以方便我们 编辑和修改。框架网页实际上就是在一个视屏范围编辑和修改。框架网页实际上就是在一个视屏范围 内同时显示多个网页文件的做法。通常内同时显示多个网页文件的做法。通常, , i index.htmndex.htm是框架网页的是框架网页的主文件主文件。 三、规划网页的数量三、规划网页的数量 我们知道我们知道, ,每一个民族都有不同的历史简介、
9、习俗、每一个民族都有不同的历史简介、习俗、 服饰和节庆。那么我们就需要为每一个民族就这四服饰和节庆。那么我们就需要为每一个民族就这四 方面各制作一个网页。方面各制作一个网页。 请计算请计算, ,你计划制作多少个相关的民族介绍网页你计划制作多少个相关的民族介绍网页? ? 相关链接相关链接 网页数量网页数量 指一个网站内所有的网页数量指一个网站内所有的网页数量, ,即能打开的即能打开的 页面的总和。页面的总和。 拓展学习拓展学习 我们要制作的网页数量是巨大的我们要制作的网页数量是巨大的, ,你打算把它们存你打算把它们存 储在哪里储在哪里? ?你是否打算对它们进行分类存放你是否打算对它们进行分类存放? ?该怎样该怎样 分类存放呢分类存放呢? ?做做看。做做看。 (四)课堂小结(学生自己总结)(四)课堂小结(学生自己总结) 通过这节课的学习,我学会了运用表格去设计页面通过这节课的学习,我学会了运用表格去设计页面 的布局的布局, ,使用网页框架使用网页框架, ,规划页面的数量和链接关规划页面的数量和链接关 系系