第七讲网页设计与制作 DreamweaveCs5.pptVIP

第七讲 模板和库 【概述】 模板和库都是神奇的网页设计技术。在Dreamweaver中可以利用模板和库设计出具有统一风格的网页，同时也能更加方便网站的更新和维护。本讲重点内容是：模板和库的概念、创建模板、定义可编辑区域、套用模板、修改模板和库等内容。 7.0 资源 资源是指网站中用到的图片、颜色、链接、动画等元素。执行【窗口】-【资源】命令，打开“资源”面板，如图所示。 Flash： Macromedia Flash 格式文件。注意这里仅仅显示 SWF 文件（压缩的 Flash 文件，后缀名为“.swf”），而不显示 FLA（Flash 源文件，后缀名为“.fla”）文件。 Shockwave： Macromedia Shockwave 格式文件。 影片： QuickTime 或 MPEG 格式文件。 脚本： JavaScript 或 VBScript 文件。 模板：显示模板文件。 库项目：显示库项目文件。 “资源”面板右下方的几个按钮的作用如下： ：刷新站点列表。 ：新建模板或库项目。 ：编辑资源。 ：删除资源。 7.0.1 模板 模板是一项伟大的技术。模板是一种特殊的文档，只要一个网页的基本版式设计好后，把它保存为模板，以后就可以重复使用该模板来建立新的网页，新建立的网页会自动套用模板中设计好的版式。当修改完模板的版式并保存后，Dreamweaver会瞬间自动修改所套用的这个模板网页。当一个网站有成千上万个网页时，如果没有应用模板技术，在更新这个站点时会使这种工作变得极其困难。如果应用了模板这项技术，要更新这个站点，将极其容易。在“资源面板”中单击“模板”按钮 ，显示站点中所有模板。 7.8 练习 将文档同模板分离 当修改页面中的可编辑区域和非编辑区域时，必须将页面和模板分离。选择“修改”→“模板”→“从模板中分离”命令，即可将页面同模板分离，此时，可以编辑页面中的所有区域。 7.6 设置模板参数 模板中定义的可编辑区域和非编辑区域被高亮显示的矩形边框包围，通过设置可以改变这些高亮颜色的属性，以区分可编辑区域和非编辑区域。 选择“编辑”→“首选参数”命令，在打开的首选参数对话框中选择“标记色彩”选项，然后在右边域中设置高亮显示属性。 标记色彩 设置模板参数 单击“可编辑区域”色盘选取一种高亮颜色，或者在文本框中输入高亮颜色对应的十六进制代码。 在“锁定的区域”域中设置非编辑区域的高亮颜色，方法同上。 选择“显示”复选框确定在文档窗口中是否显示设定的高亮颜色。 选择“查看”→“可视化助理”→“不可见元素”命令，可以显示非可见元素。 7.7 模板应用 模板创建 模板保存 模板应用 模板创建 1．在Dreamweaver文档窗口中新建一个文档。 2. 在文档中插入四行一列的表格以创建页面的大体框架。 3. 选中表格中的第一行或将光标放在第一行内，单击属性面板上的拆分单元格为行或列按钮 ，将第一行分割成两个单元格。 * 了解模板及其基本特点 掌握模板的创建、使用与保存 掌握使用模板创建页面的方法与技巧 主要内容 模板简介 创建模板 使用资源模板 定义模板可编辑区域 创建基于模板的文档 设置模板参数 模板应用 图“资源”面板 选择“站点”列表则显示站点的所有资源；选择“收藏”列表仅显示收藏的资源。可以使用“资源”面板来组织和管理站点中使用到的资源，“资源”面板中显示了站点中的资源，并且把它们分为以下几类： 图像：站点中各式各样的图像，包括 GIF、JPEG 或 PNG 格式的图像文件。 颜色：站点的文档和样式表中使用的颜色，包括文本颜色、背景颜色和链接颜色。 URLs：当前站点文档中的外部链接。此类别包括下列类型的链接：FTP、gopher、HTTP、HTTPS、JavaScript、电子邮件（mailto）和本地文件（file://）。 7.0.2 库 库项目是用来放置站点中重复使用的元素对象，可以被定义为库项目的元素很多，比如文字、图像、表格等。如果将网页的部分内容定义为库项目，则当更新该库项目时，所有使用库项目的页面都得到更新。模板和库有相似之类，比如瞬间更新网站内容。不同的是：使用模板是整体页面形式相同，部分元素不同；使用库是部分元素相同，整体页面形式差别很大。也就是说，模板的作用是将整个网页“共享”起来，而库的作用只是将网页中局部元素“共享”起来。当然完全可以在同一个网页中既应用模板又应用库项目。在“资源面板”中单击“库”按钮 ，显示库项目，如图所示。 图 “资源”面板－库项目 在文档中选择库项目后，会显示“库项目”属性面板，如图所示。 图 “库项目”属性面板 Src：显示库项目源文件的文件名和位置。 打开：打开库项目的源文