170 likes | 293 Views
第 9 章 模板和库. 本章学习知识点. ● 掌握模板和库的创建方法 ●掌握模板和库的应用方法. 上一张. 返回. 下一张. 开始. 本章内容目录. 9.1 模板. 9.2 库. 9.1 模板. 9.1.1 创建模板. 9.1.2 编辑模板. 9.1.3 模板区域. 9.1.4 应用模板. 9.1.5 管理模板. 9.1.1 创建模板. 创建模板有两种方式:直接创建空白模板和将现有网页保存为模板。. 1 .直接创建空白模板.
E N D
第9章 模板和库 本章学习知识点 ●掌握模板和库的创建方法 ●掌握模板和库的应用方法 上一张 返回 下一张 开始
本章内容目录 9.1 模板 9.2 库
9.1 模板 9.1.1 创建模板 9.1.2 编辑模板 9.1.3 模板区域 9.1.4 应用模板 9.1.5 管理模板
9.1.1 创建模板 创建模板有两种方式:直接创建空白模板和将现有网页保存为模板。 1.直接创建空白模板 选择主菜单“文件”→“新建”命令,或者按Ctrl+N组合键,弹出“新建文档”对话框。 在“类别”列表框中选择“模板页”选项,在右侧“基本页”列表框中选择“HTML模板”选项,单击 按钮,创建空白模板,如图9-1所示。 图9-1 “新建文档”对话框
创建后,在编辑窗口中对空白模板进行编辑,然后选择主菜单“文件”→“另存为模板”命令,弹出“另存为模板”对话框,如图9-2所示。 其中的属性功能如下: 1、站点:在站点下拉列表框中选择把模板保存到哪个站点。 2、现存的模板:显示的是选择的站点中已经存在的模板文件。 3、另存为:为模板设置一个名字。 图9-2 “另存为模板”对话框 保存后,站点中将自动新建一个名为Templates的文件夹,所有的模板文件都默认保存在这个文件夹中,模板文件的扩展名为.dwt,如图9-3所示。 图9-3 创建的模板文件
2.将现有网页保存为模板 在Dreamweaver 8中打开要保存为模板的网页文件,选择主菜单“文件”→“另存为模板”命令,打开“另存为模板”对话框。 选择要保存到的站点,设置好模板的名字,单击“保存”按钮,即可保存模板文件到指定的站点。 9.1.2 编辑模板 创建模板后,可以像编辑普通网页一样对模板进行编辑,通常是在模板网页上添加Logo、Banner、导航条和背景图像等网页元素并固定它们的位置,然后保存成模板,用来制作其他的页面时使用。 打开“资源”面板,单击“模板”按钮,右侧将显示站点中的所有模板资源,选择需要的模板文件打开,即可在编辑窗口中进行编辑,如图9-4所示。 图9-4 “资源”面板
9.1.3 模板区域 可以在模板中创建不同功能的区域,在套用该模板制作网页时,这些区域可以用来编辑新的内容或者限制对其做所不允许的编辑。 Dreamweaver 8中的模板区域分为4种: 1.可编辑区域 2.可选区域 3.重复区域 4.可编辑标记属性 1.可编辑区域 可编辑区域就是模板中供用户编辑的区域,可以在模板中的任何位置创建可编辑区域,可以创建多个可编辑区域,一个模板中至少应包含一个可编辑区域,否则模板无法编辑。
将鼠标光标定位至要插入可编辑区域的位置,选择主菜单“插入”→“模板对象”→“可编辑区域”命令,快捷键为Ctrl+Alt+V,在弹出的下拉菜单中选择“可编辑区域”命令,如图9-5所示。 弹出“新建可编辑区域”对话框,在“名称”文本框中输入可编辑区域的名称,单击“确定”按钮,即可在指定位置插入一个可编辑区域,如图9-6所示 图9-5 菜单 图9-6 新建可编辑区域
2.可选区域 可选区域用来在模板中定义一个控件或者一个区域是否显示在基于该模板的页面中,它是由条件语句控制的,可以在模板中设置它的参数或者为其编辑表达式,用来控制该区域是否可见。 选择“可选区域”命令后将弹出“新建可选区域”对话框,如图9-7所示。 1、名称:为该可选区域设置一个名字。 2、默认显示:选中该复选框,显示可选区域中的内容;取消该复选框,隐藏可选区域中的内容。 图9-7 新建可选区域
3.重复区域 可以把模板中的某个控件或者区域创建为重复区域,重复区域不可编辑,但是可以在重复区域中插入可编辑区域使其可以编辑。 选中页面中的某个控件或者将鼠标光标定位至要插入重复区域的位置,选择主菜单“插入”→“模板对象”→“重复区域”命令,在弹出的下拉菜单中选择“重复区域”命令,弹出“新建重复区域”对话框,如图9-8所示。 图9-8 新建重复区域
4.可编辑标签属性 可以在模板中定义某些网页元素在应用到基于该模板的页面中时所允许进行编辑的属性,例如设置某张图片只能编辑其对齐方式,而不能编辑其边框大小。 选中要定义可编辑标签属性的网页元素,选择“修改”→“模板”→“令属性可编辑”命令,弹出“可编辑标签属性”对话框,在对话框中选择标签并进行设置即可,如图9.10所示。 图9-10 “可编辑标签属性”对话框
9.1.4 应用模板 选择主菜单“文件”→“新建”命令,或者按下Ctrl+N组合键,弹出“新建文档”对话框,选择“模板”选项卡,在对话框中选择要使用的模板,右侧会出现模板的预览图像。 选中“当模板改变时更新页面”复选框,这样在对模板进行改变时会自动对应用了该模板的其他页面做相应的修改,如图9-11所示。 单击“创建”按钮,即可应用该模板创建新页面。 图9-11 “从模板新建”对话框
9.1.5 管理模板 在Dreamweaver 8中可以通过“资源”面板对创建的模板进行集中管理,“资源”面板如图9-12所示。 可以对模板进行以下操作: 1.打开模板 2.删除模板 3.重命名模板 4.复制到其他站点 图9-12 在“资源”面板中管理模板
9.2 库 9.2.1 创建库项目 9.2.2 编辑库项目 9.2.3 应用库项目
9.2.1 创建库项目 选中要创建为库项目的网页元素,选择主菜单“修改”→“库”→“增加对象到库”命令,按照提示创建库项目。 创建一个库项目后,Dreamweaver 8会在站点目录中自动创建一个名为Library的文件夹,该站点中所有的库项目文件都保存在该文件夹中。 库项目文件的后缀名为.LBI 9.2.2 编辑库项目 在“资源”面板中单击“库”按钮可以显示当前站点中的所有库项目,在要编辑的库项目上双击,或者选中要编辑的库项目,然后单击下方的“编辑”按钮即可打开库项目文件进行编辑。
9.2.3 应用库项目 将鼠标光标定位到要插入库项目的位置,打开“资源”面板,选中要插入的库项目,单击下方的“插入”按钮,即可将库项目插入到指定位置。 选中页面中的库项目,显示其“属性”面板,如图9-13所示。 图9-13 “属性”面板 可在“属性”面板中对库项目进行编辑。