网页设计与制作项目式教程 教学课件 作者 凌云项目八 项目八 利用库和模板制作网站二级页面.pptVIP

任务一 利用库制作网站页首和页脚 【项目描述】 网站的页面一般会采用统一的页面结构。如图4-1所示是“Glamorous Sky”网站的首页。该页面采用的是传统的上中下结构，也就是将页面分为页首、内容和页脚。对于这一结构我们在制作网站的其他页面时，通常采用保留页首和页脚，仅仅对中间内容部分进行相应制作修改。也就是说在这个网站里面，图中所示的页首和页脚处，是在多个网页页面里面被重复制作的。对于一个网站中被重复的对象，我们就可以把它们制作成库项目。 任务二 制作网站二级页面模板 【项目描述】 在一个较为复杂的站点中，确保所有页都具有相同布局的最佳方法就是使用模板。如图4-1所示，网站Glamorous Sky的基本结构是上中下结构，其中页首和页脚保持不变，每个页面只是改变了中间部分的内容。为提高网站的制作效率以及确保结构统一，可以制作一个网站二级页面模板，将中间部分定义为可编辑区域，而页首和页脚部分内容固定。 项目八 利用库和模板制作网站二级页面 任务一 利用库制作网站页首和页脚 【知识目标】 了解库的基本概念。 熟悉库项目的创建方法和基本操作(编辑、删除和重命名等)。 掌握库的管理和库项目的应用方法。 任务一 利用库制作网站页首和页脚 【技能目标】 能创建库项目。 能对库项目进行基本操作。 能灵活应用库项目。 8.1.1 项目准备 8.1.1.1 库和库项目的概念 库可以用来存放Web站点中经常重复使用的网页元素，如图像、文本和其他对象等。 这些网站页面元素放入库中，我们就称这些元素为库项目。 当在一个站点中创建库时，Dreamweaver会在站点目录下自动创建一个名为Library的文件夹。 创建的库项目文件后缀为.lbi。 8.1.1.2 创建库项目 创建库项目的方法有两种： 直接新建库项目 把已有页面元素转换为库项目 8.1.1.3 库项目的基本操作 编辑库项目 重命名库项目 删除库项目 恢复删除的库项目 8.1.1.4 库项目的使用 在文档中插入库项目 将已经引用的库项目和源文件分离 8.1.2 项目实现 根据前面所学内容，新建站点 在站点中新建一个images文件夹，将本站点使用的图片素材保存到新建的images文件夹中 创建页首库项目 创建页脚库项目 8.1.3 知识拓展 更新使用指定库项目网页 单击菜单【修改】/【库】/【更新页面】命令，打开“更新页面”对话框 根据需要在“查看”下拉列表中进行选择 选择“显示记录”选项，可以查看站点的更新状态 单击“开始”按钮，进行更新 8.1.4 项目训练 利用库的操作，创建图示网页的页首库项目和页脚库项目 任务二 制作网站二级页面模板 【知识目标】 了解模板的基本概念。 掌握模板和库的区别。 掌握模板的创建方法和使用方法。 掌握模板的管理方法。 任务二 制作网站二级页面模板 【技能目标】 能创建模板。 能对模板进行基本编辑。 能创建基于模板的网页。 8.2.1 项目准备 8.2.1.1 模板的概念 模板是一种特殊类型的文档，用来设计统一的页面布局。 利用模板创建页面，不仅能保持页面布局、页面风格的统一，而且能很大程度上提高网页制作效率。 当在一个站点中创建模板时，会在站点目录下自动创建一个名为Templates的文件夹。 创建的模板文件后缀为.dwt。 8.2.1.2 模板和库的区分 模板用于批量制作或修改网页，而遇到只是需要网页中的某些元素（如表格、图片等）保持统一，或者某个元素需要大量应用于多个网页的不同位置的情况时，就需要使用库。 模板和库都可以通过资源面板查看 8.2.1.3 创建模板 创建模板方法一 单击菜单【文件】/【新建】 新建类型中选择“空模板”，选择合适的模板类型和布局。单击“创建”按钮。 创建模板方法二：单击资源面板中模板面板右下方的新建按钮，新的模板显示在面板中， 在“Untitled”处输入模板名称后，双击可进行编辑。 创建模板方法三：单击菜单【插入记录】/【模板对象】/【创建模板】。 创建模板方法四：编辑一个普通页面，然后单击菜单【文件】/【另存为】，将保存类型选为“模板文件”，单击“保存”。 8.2.1.4 模板区域的类型 模板共有四种类型的模板区域： 可编辑区域 重复区域：可以在模板中插入的重复区域有两种：重复区域和重复表格。 可选区域 可编辑标签属性 8.2.1.5 检查模板语法 在保存模板前，为确保模板不存在语法错误，用户可以使用“检查模板语法”命令来检查模板的语法。操作步骤如下： 单击菜单【修改】/【模板】/【检查模板语法】。 如果语法正确，则会弹出“模板语法正确”的对话框。 若存在语法错误，则会弹出相应的语法错误提示对话框，用户只需根据提示修改错误即可。 8.2.1.6 创建基于模板的网页