1、1,第4章 快速建站技术 模板和库的应用,2,4.1 模板的建立,余姚市第四职业技术学校 陈伟,3,1了解第4章的教学内容:介绍模板和库的概念、介绍模板和库的区别、掌握模板的建立和基础应用技术;掌握库的建立和基础应用技术教学目的是让网页制作者能快捷地制作网页和提高网页设计的工作效率。 2引入第1节内容当建立一个网站时,我们会发现站内许多页面的版面和元素都是相同的,因此在设计一个新页面时,还可以复制原来做过的页来减轻工作量。但如果在建成所有页面后,要对所有页面的共同元素进行修改或更新时,会发现工作量实在太大!而使用Dreamweaver软件中的模板功能可以大大减轻工作量,提高网站维护工作效率。,
2、新课导入,4,资源面板介绍,介绍 是DreamweaverMX软件的新功能之一, 执行菜单“窗口”|“资源”命令(或按功能键F11),可打开“资源面板” 。 资源分类: 图像、颜色、链接、Flash、影片、Shockwave、脚本、模板和库 。 按钮功能: 插入、刷新、添加、编辑、添加到收藏夹,5,什么是模板,简介: 类似于Word中的模板功能。是以网站中的一个页面为模型制作出一个模板,然后再以这个模板为基础创作其他的页面,这些页面与第一个用来做模板的网页具有统一的结构和风格。但又不完全和Word中的模板相同,通过修改网页模板中锁定部分,可以同时修改所有使用这个模板页面的相同部分。 使用模板的
3、好处: 1. 你可以将网页中的共同元素,如Banner图片、导航栏等做到模板中,那么在修改用模板建立的共同页面时,只要修改与之对应的“模板”就可以收到同样的效果。模板更新时,所有使用该模板的页面也会同时进行更新从而大大减少了页面设计的工作量,方便了网页的更新维护。 2. 利用模板设计网页的版面,可以快速制作出风格一致、结构统一的网站。 模板面板简介,6,模板的创建,可以通过三种方法来创建模板: (1)在“资源面板”中单击按钮,然后单击下方的按钮,我们可以在面板中为模板命名,双击模板名称,便在编辑区打开了空白模板。 (2)在打开的网页编辑窗口中打开“插入面板”中的“模板面板”,单击(创建模板)按
4、钮,或者选择“文件菜单”下的“另存为模板”命令,可以将当前打开的网页保存为模板。 (3)选择“文件菜单”下的“新建”命令,在“新建文档”对话框中选择“基本页”或“模板页”选项,选择一种模板,再单击,也可创建模板。 跟我学实例演示:给01V1站点创建模板 学生上机操作:熟悉资源模板和模板的创建(15分钟) 再请一名学生上台操作,检查上机效果,巩固所学的操作,7,模板可编辑区域的建立与取消,什么是可编辑区域 “可编辑区域”是模板中一个很重要的概念,它指的是模板中可以编辑的部分。 可编辑区域的建立 实例演示跟我学:给“01V1”站点的模板创建可编辑区域。 创建可编辑区域时,要注意的事项: 在模板中,
5、我们即可修改可编辑区,也可修改锁定区。但当该模板被应用到网页中后,就只能修改网页的可编辑区; 在定义可编辑区时,我们以把整个表格定义成可编辑区域,也可把单个单元格定义成可编辑区,但不能一次把几个单元格定义成一个编辑区域; 层与层中的内容是彼此独立的,如果把层定义为可编辑区域,用模板建立的网页允许你修改层的位置关系;如果你只把层的内容定义为可编辑区域,则只能改变层内的内容; 由模板生成的子页面中可能无法加入meta、CSS或者一些Behaviors。这是因为没有定义可编辑区域。必须手工在模板中的标记中加入代码,在想编辑的区域外面包上。,8,模板可编辑区域的建立与取消,可编辑区域的取消 实例演示跟
6、我学:给“01V1”站点的模板中可编辑区域的取消。 学生上机操作: 熟悉资源模板和模板的创建(15分钟) 再请一名学生上台操作,检查上机效果,巩固所学的操作 。,9,上机操作,熟悉资源面板的使用 上机操作创建老师演示的实例“01V1”网站的模板及可编辑区域 根据提供的素材设计“中国旅游”网站,并制作网站的模板,10,小结,什么是“资源面板”,什么是模板 模板的建立方法 模板中可编辑区域建立和取消的方法,11,作业,书:第二章习题P60 1.1、1.2、1.3、1.4、1.5、1.6、1.10、1.11、1.12、2.2、2.5、2.6、2.7、2.8、3.1、3.2、3.5 2温习所掌握的操作,掌握模板的创建和可编辑区域的建立取消 3有能力的人根据提供的素材设计“中国旅游”网站,并制作网站的模板 4预习下一节内容,