统一站点风格课件.ppt

1、Dreamweaver 应用技术 Dreamweaver 8 实训教程讲义第11章 统一站点风格重点内容：模板的创建 编辑模板的方法 模板的应用 库的创建和使用Dreamweaver 应用技术 Dreamweaver 8 实训教程讲义一、模板的创建：1.将现有文档保存为模板 打开要保存为模板的文件，选择【文件】|【另存为模板】命令，弹出【另存为模板】对话框，保存模板文件。【另存为模板】对话框Dreamweaver 应用技术 Dreamweaver 8 实训教程讲义一、模板的创建：2.创建空白模板 选择【文件】|【新建】命令，弹出【新建文档】对话框，切换到【常规】选项卡，在【类别】列表框中选择【

2、基本页】或【动态页】选项，并在右侧的列表框中选择任意选项，然后单击【创建】按钮创建一个空白文档，再选择【文件】|【另存为模板】命令，弹出【另存为模板】对话框，即可将文档另存为模板文件。Dreamweaver 应用技术 Dreamweaver 8 实训教程讲义一、模板的创建：3.创建嵌套模板 在【资源】面板的【模板】类别中右击要作为创建新文档基础的模板，从弹出菜单中选择【从模板新建】命令，即可创建新文档，并出现在文档窗口中。然后，选择【文件】|【另存为模板】命令，或者在【插入】工具栏的【常用】类别中单击【模板】按钮右侧的下拉按钮，从弹出菜单中选择【创建嵌套模板】命令，弹出【另存为模板】对话框，从

3、中指定嵌套模板的名称，然后单击【确定】按钮，即可创建一个嵌套模板。Dreamweaver 应用技术 Dreamweaver 8 实训教程讲义一、模板的创建：嵌套模板Dreamweaver 应用技术 Dreamweaver 8 实训教程讲义二、编辑模板：1.创建可编辑区域 选择【插入】|【模板对象】|【可编辑区域】命令，弹出【新建可编辑区域】对话框。在【名称】文本框中输入可编辑区域的名称，然后单击【确定】按钮。【新建可编辑区域】对话框Dreamweaver 应用技术 Dreamweaver 8 实训教程讲义二、编辑模板：2.锁定可编辑区域 单击可编辑区域的标签以选定此区域，然后选择【修改】|【模

4、板】|【删除模板标记】命令。Dreamweaver 应用技术 Dreamweaver 8 实训教程讲义二、编辑模板：3.创建可选区域 插入可选区域选择【插入】|【模板对象】|【可选区域】命令，弹出【新建可选区域】对话框。切换到【基本】选项卡，在【名称】文本框中输入此可选区域的名称。插入可编辑的可选区域选择【插入】|【模板对象】|【可编辑的可选区域】命令，弹出【新建可选区域】对话框。为该区域输入名称，并设置其他所需选项。Dreamweaver 应用技术 Dreamweaver 8 实训教程讲义二、编辑模板：4.创建重复区域 选择【插入】|【模板对象】|【重复区域】命令，弹出【新建重复区域】对话框

5、，在【名称】文本框中输入重复区域名称，然后单击【确定】按钮。【新建重复区域】对话框Dreamweaver 应用技术 Dreamweaver 8 实训教程讲义二、编辑模板：5.插入重复表格 选择【插入】|【模板对象】|【重复表格】命令，弹出【插入重复表格】对话框，进行所需的设置。【插入重复表格】对话框Dreamweaver 应用技术 Dreamweaver 8 实训教程讲义二、编辑模板：在模板中创建不同的区域Dreamweaver 应用技术 Dreamweaver 8 实训教程讲义三、模板的应用：1.创建基于模板的文档 选择【文件】|【新建】命令，弹出【新建文档】对话框，切换至【模板】选项卡，从

6、【模板用于】列表框中选择一个站点，然后从右侧的站点文档列表框中选择一个模板，单击【创建】按钮。【模板】选项卡Dreamweaver 应用技术 Dreamweaver 8 实训教程讲义三、模板的应用：2.在现有文档上应用模板 可以利用【资源】面板或通过文档窗口将模板应用于现有文档。把模板应用到现有文档时，Dreamweaver将尝试将现有内容与模板中的区域进行匹配。如果应用的是现有模板的修订版本，则名称会根据情况自动匹配。如果把模板应用到一个尚未应用模板的文档，则没有可编辑的区域可以进行比较，且会出现不匹配。Dreamweaver会跟踪这些不匹配的情况，这样用户就可以选择将当前页的内容移动到哪些

7、区域，或者删除这些不匹配的内容。Dreamweaver 应用技术 Dreamweaver 8 实训教程讲义三、模板的应用：2.在现有文档上应用模板【不一致的匹配名称】对话框Dreamweaver 应用技术 Dreamweaver 8 实训教程讲义三、模板的应用：3.更新基于模板的页面 修改模板后，Dreamweaver会自动提示用户更新基于该模板的文档，用户可以根据需要自动更新或手动更新当前文档或整个站点。【更新模板文件】对话框Dreamweaver 应用技术 Dreamweaver 8 实训教程讲义四、库的创建和使用：1.创建库项目 选择【窗口】|【资源】命令，显示【资源】面板，单击面板左侧

8、的【库】按钮，显示库类别。然后，将元素拖到库类别中，即可创建一个新的库项目。为新的库项目输入所需名称后按Enter键即可。库项目保存在站点本地根文件夹的Library文件夹中。每个库项目都保存为一个单独的文件，文件扩展名为*.lbi。Dreamweaver 应用技术 Dreamweaver 8 实训教程讲义四、库的创建和使用：2.应用库项目 选择【窗口】|【资源】命令，显示【资源】面板，切换到库类别，在库项目列表中选择要插入的库项目，单击面板底部的【插入】按钮，即可将库项目应用到网页中。【资源】面板的库类别Dreamweaver 应用技术 Dreamweaver 8 实训教程讲义四、库的创建和使用：3.编辑库项目 显示【资源】面板的库类别，从库列表中选择要进行编辑的库项目，然后单击面板底部的【编辑】按钮，或者直接双击库项目名称，系统会自动打开一个用于编辑该库项目的窗口。库项目的编辑窗口Dreamweaver 应用技术 Dreamweaver 8 实训教程讲义四、库的创建和使用：4.更新应用库项目的页面 选择【修改】|【库】|【更新页面】命令，弹出【更新页面】对话框，选择要更新的网页范围及所需站点或模板名称，并确保选择了【更新】选项组中的【库项目】复选框，单击【开始】按钮即可更新网站。【更新页面】对话框