模板与库.

Presentation on theme: "模板与库."— Presentation transcript:

1 模板与库

2 复习提问 1、统一网站风格可采用的方法？ CSS样式、框架 2、两种方法的局限性： CSS样式：只针对于网页元素的统一，而不是整个页面文件
框架：页面设计有局限，涉及到的文件多 3、同一主题相似网页的设计方法？ 已有解决方法：复制（不易更新）、框架（页面受局限） 目标解决方法：使用模板制作网页

3 课程引导 当一个网站中的多个页面均为风格统一、布局基本一致的网页时。为了提高工作效率，尽量减少重复劳动，使用模板是最好的方法 。
当一个网站元素被反复使用时，使用库项目可减少重复劳动。

4 知识目标 （1）能够编辑模板和将模板生成新网页。 （2）能够应用库项目制作网页。 （3）能够使用模板和库项目统一网站风格；

5 案例展示 “学无止境”网站

6 任务分析 本例的多个网页就使用了建立好的模板，根据网站要求，设计方案如下： 1、首先设计制作一个网页模板 2、再使用模板制作其他页面。

7 知识讲解（一） 2、设置模板页面属性 一、模板 模板：扩展名为.dwt，保存于Templates文件夹中 1、创建模板 创建一个全新的模板
简单介绍“资源管理器”面板 创建基于文档的模板：文件——另存为模板。 2、设置模板页面属性 用模板创建的文档继承模板的页面属性，页标题除外。 设置：修改——页面属性 3、定义模板的可编辑区 4、模板的应用和更新 应用模板创建文档： 把页面从模板中分离出来 修改模板 更新站点中使用模板的所有文件

8 操作示范（一） 制作“学无止境”网站： 1、制作模板页面 文件→新建→基本页→HTML→另存为模板→mb1.dwtTemplates文件夹）
按要求制作模板页面 2、插入可编辑区域 选中模板页面中的可编辑区域（每个页面内容不同处） 本例中为表格（<table>）， 插入→模板对象→可编辑区域→命名（本例为edit1） 3、使用模板创建其他页面： 文件→新建→模板→mb1→创建→保存 （文件命名，如english.htm等） 在可编辑区域edit1处输入本页内容，依次创建其他页面。

9 知识导入 讨论交流 模板的优势？ 风格统一，有利于保持网页风格的一致； 更新容易，提高工作效率 与框架相比，不受页面限制。 引出问题：
如果需要重复的不是完整页面，只是页面中的部分内容，而且出现在页面中的位置又不固定，应该如何解决？

10 知识讲解（二） 二、库项目 库是一种用来存储想要在整个网站上经常重复使用或更新的页面元素（如图像、文本和其他对象）的方法。这些元素称为库项目。 通过修改库元素，可以实现整个网站各页面上与库元素相关内容的一次性更新。库元素存放在库文件中，库文件（*.lbi）存在站点根目录的Library文件夹内。 1、创建库项目： 2、插入库项目 3、修改库 4、与库分离 5、更新整个站点或所有使用特定库项目的文档： 6、更改当前文档以使用所有库项目的当前版本

11 操作示范（二） 使用库项目设计网页： 1、创建一个库项目 2、将库项目应用于任意网页中的任意位置 3、更新库项目

12 课堂模仿 按演示案例完成“学无止境”网站的模板设计，使用模板设计各个网页，统一网站风格。 练习模板的更新与分离
设计不同形式的库项目应用于网页

13 疑难解析 问题1：Dreamweaver 8创建网页模板有哪些 方法，其创建步骤怎样？ 问题2：如何对模板中不可编辑区域进行编辑？
问题3：如果将网页中的库文件和源文件分离？修改库文件之后，已脱离库文件的网页是否能进行更新？

14 归纳总结 本单元主要学习了模板和库的网页布局方法，制作网页不仅追求美观、而且要提高制作效率，使用模板和库文件是提高网页制作效率的有效途径。
本单元重点、难点： 编辑模板、将模板生成新网页

15 扩展性任务 “沧职计协”网站（使用模板统一设计）

16 结束