《Dreamweaver CS5网页设计与制作实例教程》课件-第5章 模板与库

第5章模板与库5.1模板5.1.1创建模板5.1.2编辑模板5.1.3使用模板与脱离5.1.4模板应用5.2库小结5.1模板

用模板可以创建具有统一结构和外观的网站。在需要更改网站的整体外观时，只要对相应的模板文件稍作修改，即可对整个网站进行快速更新。5.1.1创建模板创建模板有两种方法：在Assets面板中按“新建”按纽，创建模板，修改已有的HTML文档然后存成模板。模板可以自动保存在站点根目录下的Templates文件夹内。边讲边操作5.1.2编辑模板

模板内分为可编辑区及不可编辑区，缺省是不可编辑区。不可编辑区是指引入模板的文档而言；在模板环境下（.dwt）均可编辑。可编辑区<!--TemplateBeginEditablename="aaa"-->可编辑区的内容<!--TemplateEndEditable-->不可编辑区普通网页的不可编辑区在Dreamweaver代码编辑器中以灰色字体显示，不能被修改，但在其他编辑器（如记事本）中不可编辑区代码是可以修改的。

5.1.2编辑模板建立可编辑区做表格，划分区域。选中一区域－>“插入”面板|“常用”选项卡|“可编辑区”按钮删除可编辑区域指向可编辑区执行右键菜单“模板”|“删除模板标记”存盘可以存成*.htm或*.dwt。5.1.3使用模板1．使用模板和脱离模板使用：从“资源”面板中的“模板”类别中选中要插入的模板，直接拖动到网页中脱离：如果要修改应用了模板的文档中的不可编辑区域，须将文档和模板分离。菜单命令“修改”|“模板”|“从模板中分离”更新模板时，已分离的文档不再会随之更新！5.1.3使用模板2．用模板更新网站文档中只有不可编辑的部分才会随模板更新修改模板并执行菜单命令“文件”|“保存”5.1.4模板创建和应用实例【例5-1】制作一个简单的小商品销售网站模板,如图1。并应用该模版制作页面2和3。【例5-1】详细步骤看教材5.2库

库项目可以包含文本、表格、图象、Java程序、插件、Active元素；当修改某个库项目后，整个网站包含该库项目的网页均自动更新。建立库项目：拖入“资源”面板的“库”中（起名）。若用Ctrl＋拖入，则文档中元素仍是文档元素，不是库元素，无指针。应用库项目：拖出即可。编辑库项目：双击库中目标对象—>编辑库项目—>存盘“文件”|“保存”—>更新页面窗口。更新：“修改”|“库”|“更新当前页”或“修改”|“库”|“更新页面”库项目“属性”面板：脱离库5.2.1创建库项目

创建库文件有两种方法：1.新建库文件2.将网页内容转化为库文件。5.2.2插入库项目

上面将网页内容转换为库文件后，对于转换成库文件的内容，网页中已经算是插入了这个库文件，背景显示为淡黄色，并且不可编辑。当然，我们同样可以反复地插入已建立的库项目。5.2.3网页与库文件脱离

网页中使用了库文件，该部分元素在网页中不能直接被编辑，有时候也需要进行脱离以便单独进行修改。方法是：选中网页中插入的库文件，在其对应的“属性”面板中单击“从源文件中分离”按钮。这样，原来不可编辑的库文件区域也可以进行编辑修改了。【例5-2】创建库项目并使用库更新页面文件小结由于模板文件决定了网页的布局框架，所以可能有时风格一致，但缺乏灵活性和个性。库项目则可以弥补这一不足。将若干网页元素