Dreamweaver CS3网页设计与制作教程 第2版 教学课件 作者申莉莉教案12章.ppt

《Dreamweaver CS3网页设计与制作教程 第2版 教学课件 作者申莉莉教案12章.ppt》由会员上传分享，免费在线阅读，更多相关内容在教育资源-天天文库。

1、第12章模板和库本章主要内容是模板和库的基本知识和使用方法，包括：创建模板；定义模板的可编辑区域、重复区域和可选区域；定义嵌套模板；应用模板建立网页，修改模板并更新站点；库的创建、编辑和使用。12.1案例：模板【案例目的】利用模板编辑网页，创建模板，学会定义模板的可编辑区域。定义模板的可选区域，修改定义模板的可选区域。模板案例页面运行效果如图12-1所示。【核心知识】将具有相同的版面结构的页面制作成模板，再通过模板创建其他页面。图12-1页面运行效果12.1案例：模板.1.1模板在建立和维护一个站点的时候，往往需要建立外观及部分

2、内容相同的大量网页，使站点具有统一的风格。如果逐页建立、修改，这样很费时、费力，而且效率不高，一个站点很难做到有统一的外观及结构。DreamweaverCS3提供了几种方便的可以重复使用的部件来解决这个问题，分别是模板面板和库面板。12.1案例：模板.1.1模板DreamweaverCS3模板是一种特殊类型的文档，用于设计“固定的”页面布局；然后便可以基于模板创建文档，创建的文档会继承模板的页面布局。模板有可编辑区域和不可编辑区域两部分组成。不可编辑区域包含了所在页面中的共同元素，即构成页面的基本框架；称为锁定区域；而可编辑区域

3、就是可以编辑可编辑区域的相应的内容，从而得到与模板类似但又有所不同的新的网页。默认情况下Dreamweaver模板的页面中各部分是固定（即不可编辑）的。设计模板时，可以指定在基于模板的文档中哪些内容是用户“可编辑的”。使用模板，模板创作者控制哪些页面元素可以由模板用户进行编辑。模板创作者可以修改模板并立即更新基于该模板的所有文档中的设计。使用模板建立网页的最大好处就是：当修改模板时使用该模板创建的所有网页可以一次自动更新，这就大大提高了网页更新维护的效率。12.1案例：模板12.1.2创建模板模板一般保存在本地站点根文件夹中一个

4、特殊的Templates文件夹中。如果emplates文件夹在站点中没有存在，则在创建模板时将自动创建该文件夹。创建模板有两种方法。1.从空白文档创建模板方法一：执行“文件”“新建”命令，弹出“新建文档”对话框，在“类别”栏选中“空模板”，在“模板类型中”选择需要的模板类型（如HTML模板），在“布局”中选择模板的页面布局“无”，如图12-2所示，单击“创建”按钮即可。12.1案例：模板图12-2新建文档对话框12.1案例：模板执行“文件”“保存”命令，选取保存的路径、命名并保存空模板文件。方法二：在使用该方法建立新模板之前

5、，必须保证站点已经建立，按照建立站点的提示步骤一步步操作即可。只有建立完站点后，资源窗口当中的图标才能激活。在DreamweaverCS3界面中选择“窗口”“资源”命令，调出“资源”面板，单击模板图标按钮，切换到模板面板。单击模板面板底部的“新建模板“图标”，出现如图12-3所示界面，然后编辑模板文件名，输入文件名后，回车即可完成空模板的创建。创建一个新模板后，可以到站点所在本地根文件夹下的Templates文件夹中查看到该文件。12.1案例：模板图12-2图12-3编辑模板文件名提示：不要将模板移动到Templates之外或

6、者任何非模板文件放在Templates中，也不要将Templates文件夹移动到本地根文件夹之外，否则，会出现错误。12.1案例：模板2.从网站页面文件中创建新模板利用现成的网页创建生成一新模板，实际上就是借助已有的站点中的经典网页，或者自己制作生成的网页的基础上生成模板，以便在后期制作网页过程中使用。（1）打开站点website，如图12-4所示，从中选择一网页打开。图12-4“打开站点文件”对话框12.1案例：模板（2）执行“插入记录”“模板对象”“创建模板”，出现12-5所示的“另存模板”对话框。图12-5“另存模板”

7、对话框12.1案例：模板单击“保存”按钮。出现如图12-6所示对话框。如果要更新链接，则单击“是”按钮，如果不更新链接，则单击“否”。单击“是”。即可在站点的Templates文件夹中创建一个模板文件。图12-6“更新链接”对话框12.1案例：模板案例分解1：（1）打开网页，如图12-7所示。图12-7“打开网页”对话框12.1案例：模板（2）执行“插入记录”“模板对象”“创建模板”，如图12-8所示。在“另存模板”对话框另存名为“aihu1”，单击“保存”按钮。在这里单击“否”，不更新链接，成功创建新模板。图12-8执行“

8、创建模板”12.1案例：模板12.1.3定义模板的可编辑区域可编辑区域包含在根据模板创建的每个HTML网页中可以改变的信息，可能是文本，图像或者其他的媒体，如flash、java小程序，没有标记为可编辑区域的在使用此模板创建新文件时被锁定。当创建一个基于模板的网