08项目八模板制作及应用.pptVIP

项目练习 一、单选题 5．基于网页创建模板时，可以通过执行（ ）菜单操作来把网页保存为 模板。 A）“文件”→“导出为模板” B）“文件”→“保存为模板” C）“文件”→“转换为模板” D）“文件”→“另存为模板” 6．Dreamweaver中，关于模板的说法不正确的是（ ）。 A）模板是一个文件。 B）模板默认状态下被保存在站点根目录下的Templates子目录下。 C）模板是固定不变的。 D）模板和库尽管有相似之处，但总的来说仍是不同的两个概念。 项目练习 一、单选题 7．下列库的描述哪一项是错误的（ ） A）库包含已经创建的单独资源或资源拷贝的集合以便放在网页中。 B）库中可以存储各种各样的页面元素，如图象、表格、声音、FLASH 动画等。 C）库项目是可以在多个页面中重复使用的页面元素。 D）在使用库项目时，Dreamveaver自动将库中的内容插入到页面中。 项目练习 二、简答题 1．查阅相关资料，创建基于模板的网页有哪些方法？本项目使用的哪 种创建模板的方法？ 2．简要回答重复区域和可编辑区域的作用。 网页设计与网站建设 总目录 * 子目录 * * * 任务一　创建网站模板 * 任务二　应用模板 * 任务二　应用模板 谢谢观看! 项目概述 在制作网站的过程中，经常需要制作大量风格一致、网页元素重复性较高的网页，需要在设计过程中分析各个页面中哪些元素是相同的，哪些元素是不同的，然后将相同的网页元素制成模板，通过模板创建的网页会自动包含这些相同的网页元素。这样不但能统一整个网站的风格，而且还能加快网页的制作、更新和浏览的速度。 项目目标 能够熟练地将现有网页转存为模板文件，并学会根据需要灵活地设定可编辑区域，增强利用模板制作统一风格页面的意识。 能够熟练地将模板文件应用到已存在的网页上，并学会完善模板中的链接关系，统一整个网站的风格。 任务一　创建网站模板 任务二　应用模板 步骤 在创建模板前，需要确认整个网站的完成情况。运行Dreamweaver CS6，在“文件”面板中，显示出“青春无悔个人网站”的文件结构。 1 准备工作 步骤 在“文件”面板的列表中，双击文件“works.html”打开“摄影作品”页面，选择 “文件”→“另存为模板”菜单项，弹出“另存为模板”对话框，在其中的“站点”下拉列表框中选择“青春无悔个人网站”选项，“另存为”文本框中输入模板名称“moban” 。单击“保存”按钮，弹出提示框，选择“是”按钮，将页面保存为模板文件。 2 创建模板 步骤 保存模板之后，当前编辑文档变为“moban.dwt”，并且在“青春无悔个人网站”站点目录中自动生成一个“Templates”文件夹，模板文件“moban.dwt”自动保存在此文件夹中。 2 创建模板 步骤 在“moban.dwt”文档中，选中并删除表格“table2”与“table3”及其内部所添加的内容，把光标放到“table1”右边外侧，插入一个1行1列的表格，表格宽度为778像素，单元格边距、间距及边框均设置为0像素；设置“表格Id”为“edit”，居中对齐，背景颜色值为“#FFFFFF”。 3 设定可编辑区域 步骤 将光标放入表格“edit”内，选择“插入”→“模板对象”→“可编辑区域”菜单项，弹出“新建可编辑区域”对话框，在“名称”文本框中输入“EditRegion”作为可编辑区域名称。单击“确定”按钮，为表格“edit”添加了一个可编辑区域。 3 设定可编辑区域 步骤 可编辑区域名称 可编辑区域内的文本内容 图 8-6 模板中添加的可编辑区域 删除可编辑区域方框内的文本内容（注意不要把可编辑区域删掉）。 3 设定可编辑区域 在“CSS样式”面板中修改“.dh”样式，设置font-size（字体大小）为12pt，以便导航栏的文本大小显示为12pt；修改“bady”样式，设置font-size（字体大小）为14px，使所有应用模板的页面中未设置字体样式的文本大小均显示为14px。 相关知识 单击“插入”栏“常用”类别中的“模板”按钮，在弹出的下拉菜单中选择“创建模板”选项 01 选择“插入”→“模板对象”→“创建模板”菜单项 02 将当前页面另存为一个模板文件。 03 1 利用王亚伟创建模板的方式 相关知识 2 与可编辑区域有关的知识 A.创建可编辑区域之前，必须先选择想要设置为可编辑区域的文本、图像、表格等，或将插入点放在想要插入可编辑区域的地方，然后使用上述方法插入可编辑区域。如果页面中可编辑区域名称不可见，可以选择“查看”→“可视化助理”→“不可见元素”菜单项。命名可编辑区域时，不能使用单引号、双引号、尖括号和“”符号。 B