实验六 模板和库
一.实验目的:
1.掌握库与模板的基础知识:如何创建和设置库部件、为网页添加和编辑库部件;并掌握创建模板、修改模板、设置模板的各项属性等内容;
2.掌握库与模板的应用,学会通过模板和库元素创建网页的方法。
二.预备知识:
1.模板与库的认识
模板:网站的很多页面中都会有一些固定不变的内容(如标志图像、导航条等)使用模板就可以很好地解决这个问题,如果每制作一个网页都要首先实现这些固定的内容就需要很大的工作量,并容易出错。
通过模板可以生成具有固定格式的网页,并通过设定可编辑区域在其中插入不同的内容。
模板的功能就是把网页布局和内容分离,在布局设计好之后将其存储为模板,这样相同布局的页面可以通过模板创建,因此能够极大地提高工作效率。
库:库与模板的作用和使用方法类似,模板是为了方便用户对站点中所有的文档进行管理和更新,库则可以方便用户对网页局部进行更新;
库是一些网页元素的集合的文件。创建库后,库文件就是在站点根目录下名为library文件夹中以lbi为扩展名的文件。
库的内容可以包括文本、图像等所有的网页元素,它可以在站点中的其他页面上被重复使用
2.模板创建
它和制作一个普通的页面完全相同,只是不需要把页面的所有部分都制作完成,仅仅需要制作出导航条、标题栏等各个页面的公有部分,而把中间区域用页面的具体内容来填充。
3.模板中的固定区域与可编辑区域的区别和用途
在模板页中,大致可以分为两个部分,固定区域部分(模板页中直接插入的网页元素默认为
不可编辑区域),可编辑区域部分(只有把某个区域或者某段文本设置为可编辑状态之后,在应用该模板创建的文档中才可以改变这个区域的内容),如果一个模板中没有插入可编辑区域,那这个模板是没有用的。在制作模板时,我们把导航条、标题栏等各个页面的公有部分直接插入在页面上,而把变化的内容处插入一个“可编辑区域”,在利用该模板创建网页时再把该部分内容完成。
4.更改模板或库元素对使用选定的模板或包含选定库元素的网页的影响
在通过模板创建了若干个页面之后,如果需要更改页面或者增加栏目,我们可以通过Dreamweaver MX的模板或库修改功能来解决这个问题。比如我们对模板进行了修改之后,运行“文件”/“保存”命令来保存模板,这时候会弹出提示框询问是否更新所有使用了该模板的页面,确认之后就会显示出更新的页面总数以及更新的时间等信息。
5.熟悉资源面板,图6.1:
打开“资源”面板:选择“窗口”>“资源”。 出现“资源”面板。默认情况下,“图像”类别处于选定状态。
“图像”是 GIF、JPEG 或 PNG 格式的图像文件。有关图像的信息,“图像”是 GIF、JPEG 或 PNG 格式的图像文件。
“颜”是站点的文档和样式表中使用的颜,包括文本颜、背景颜和链接颜。
“URL”是当前站点文档中的外部链接。此类别包括下列类型的链接:FTP、gopher、HTTP、HTTPS、JavaScript、 (mailto) 和本地文件 (file://)。
“Flash”影片是任何版本的 Macromedia Flash 格式文件。“资源”面板仅显示 SWF 文件(压缩的 Flash 文件),而不显示 FLA (Flash 源)文件。
“Shockwave”影片是任何版本的 Macromedia Shockwave 格式文件。
“影片”是 QuickTime 或 MPEG 格式文件。
“脚本”是 JavaScript 或 VBScript 文件。请注意,HTML 文件(而不是独立的 JavaScript 或 VBScript 文件)中的脚本不出现在“资源”面板中。有关在 Macromedia Dreamweaver 中使用 JavaScript 的信息,
“模板”提供了一种方便的方法,用于在多个页面上重复使用同一页面布局,以及在模板被修改时修改附着到该模板的所有页面上的布局。
“库”项目是在多个页面中使用的元素;当修改一个库项目时,包含该项目的所有页面都将被更新。
备注: “资源”面板中仅显示属于这些类别的文件。某些其他类型的文件有时也称为资源,但这些文件不在面板中显示。
三.实验内容与要求
1.熟悉“资源面板”
2、创建、设置库部件,练习为网页添加库部件
3、创建、设置、修改模板
4、套用模板创建文档,利用库部件更新网站
5.实例设计:
四.实验步骤
1.模板实例,图6.2
这是一个模板的基本布局,在这个可编辑区域内可根据不同的页面改变其内容,而上面导航的内容及下面的制作信息是固定的不可改变的,所以模板最适合大量风格布局相同的网页。
制作步骤:
1)“文件”/“新建”,接着从窗口中选择“模板页”/“HTML模板”,点“创建”按钮,设置上面的导航条及下面的版权信息等内容。或按上述内容新建一个网页,将网页另存为模板(命名任意,扩展名为.dwt)。
2)在网页中间插入一个表格,设置表格为可编辑区域。
(插入—— 模板对象——可编辑区域——为区域命名)
3)保存模板。
4)文件——从模板新建文件即可。
2.库实例
制作步骤:
(1)新建一个网页中,在网页中制作要求的图库项目的内容
1)设计一个导航条,图dreamweaver网页模板6.3或课程设计网站的导航条;
2)设计一个网页的页脚部分,图6.4,或包括一些相关的链接,版权信息等。
(2)选中做好的内容,修改——库——增加对象到库,为库项目命名即可。
(3)应用库项目时,可直接将“资源”面板中所需要的库项目拖入网页中即可。
版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198,我们将在24小时内删除。
发表评论