DW教程--六、使用模板和库

1、.第六节   使用模板和库 在我们制作网站的过程中，为了统一风格，很多页面会用到相同的布局、图片和文字元素。为了避免大量的重复劳动，可以使用Dreamweaver8提供的模板功能，将具有相同版面结构的页面制作为模板，将相同的元素（如导航栏）制作为库项目，并存放在库中可以随时调用。 一、创建模板     模板的创建有三种方式。     1、直接创建模板     选择“窗口/资源”命令，打开“资源”面板，切换到模板子面板，如下图所示。 单击模板面板上的“扩展”按钮，在弹出菜单中选择“新建模

2、板”这是在浏览窗口出现一个未命名的模板文件，给模板命名。 然后单击“编辑”按钮，打开模板进行编辑。     编辑完成后，保存模板，完成模板建立。  2、将普通网页另存为模板      打开一个已经制作完成的网页，删除网页中不需要的部分，保留几个网页共同需要的区域。      选择“文件/另存为模板”命令将网页另存为模板。      在弹出的“另存模板”对话框中，“站点”下拉列表框用来设置模板保存的站点，课选择一个选项。“现存的模板”选框

3、显示了当前站点的所有模板。“另存为”文本框用来设置模板的命名。单击“另存模板”对话框中的“保存”按钮，就把当前网页转换为了模板，同时将模板另存到选择的站点。  单击“保存”按钮，保存模板。系统将自动在根目录下创建Template文件夹，并将创建的模板文件保存在该文件夹中。      在保存模板时，如果模板中没有定义任何可编辑区域，系统将显示警告信息。我们可以先单击“确定”，以后再定义可编辑区域。  3、从文件菜单新建模板      选择“文件/新建”命令，打开“新建文档”对话框，然后再类别中选择

4、“模板页”，并选取相关的模板类型，直接单击“创建”按钮即可。” 二、定义可编辑区域      模板创建好后，要在模板中建立可编辑区，只有在可编辑区里，我们才可以编辑网页内容。可以将网页上任意选中的区域设置为可编辑区域，但是最好是基于HTML代码的，这样在制作的时候更加清楚。      在文档窗口中，选中需要设置为可编辑区域的部分，单击常用快捷栏的“模板”按钮，在弹出菜单中选择“可编辑区域”项。  在弹出的“新建可编辑区域”对话框中给该区域命名，然后单击“确定”按钮。新添加的可编辑区域有蓝色标签，

5、标签上是可编辑区域的名称。      如果希望删除可编辑区域，可以将光标置于要删除的可编辑区域内，选择“修改/模板/删除模板标记”命令，光标所在区域的可编辑区即被删除。      这样模板文件就创建好了。  三、其他模板区域      模板中除了可以插入最常用的“可编辑区域”外，还可以插入一些其他类型的区域，分别为“可选区域”、“重复区域”、“可编辑可选区域”和“重复表格”。      1、可选区域   &

6、#160;  可选区域是模板中的区域，用户可将其设置为在基于模板的文件中显示或隐藏。当要为在文件中显示的内容设置条件时，即可使用可选区域。      2、重复区域      重复区域时可以根据需要在基于模板的页面中负值任意次数的模板部分。重复区域通常用于表格，也可以为其他页面元素定义重复区域。      3、可编辑可选区域      是可选区域的一种，可以设置显示或隐藏所选区域，并且可以编辑该区域中的内容。  四、使

7、用库      所谓库项目，实际上就是文档内容的任意组合，可以将文档中的任意内容存储为库项目，使它在其它地方被重复使用。      1、创建库      在文档窗口中选择需要保存为库项目的内容。      单击资源面板“库”分类中右下角的“新建库项目”按钮。      一个新的项目出现在资源面板“库”分类的列表中，预览框中显示预览的效果，还可以给该项目键入新名称。这样，一个库项目就创建好了。 &#

8、160;    2、插入库      将光标方在网页中需要插入库文件的位置，在资源面板“库”分类中选择需要插入的库项目，直接拖动到光标所在位置即可。      3、更改库      如果修改了库文件，选择“文件/保存”命令，弹出“更新库项目”对话框，询问是否更新网站中使用了该库文件的网页。单击“更新”按钮，将更新网站中使用了该库文件的网页。  五、创建基于模板的页面      1、打开素材cssl

9、ianxi.html文件，选择菜单栏的文件>另存为模板命令。      2、在弹出的另存为模板对话框中，在“站点”文本框选择“xmweb”，在“另存为”给模板命名为mo1，点击确定。      3、弹出是否更改链接的提示，选择“是”。此时，在站点内自动生成一个名为“Templates”的文件夹，名称为mo1.dwt的模板文件被保存在该文件夹中。      4、鼠标在网页表格的最下一行空白处单击一下，选中状态栏的<table>标签，选择菜单栏的插入>模板对象>可编辑区域命令。      5、弹出“可编辑区域”对话框，点击“确定”。这样我们就完成了模板的制作。      6、新建06.html文件，选择菜单栏