7.2 将模板并应用到其他页面

将模板应用于打开的文档的步骤如下，

(1) 新建要应用模板的空白文档。

(2) 在“资源”面板中单击“模板”图标，找到要应用的模板。

(3) 将模板从面板拖到空白“文档”窗口中。

(4) 在可编辑区域添加或编辑数据。

结果如图1所示：

图1 模板应用于页面并在可编辑区域添加了内容

小经验：在应用模板时需注意，未应用模板的HTML文档一定是空白文档，即不要添加任何内容，这样在应用模板时不会出现问题，否则，会出现应用不成功的情况。

用模板重新制作“装备”的商品展示页，步骤如示例1所示。

示例1:

(1) 新建要应用模板的空白文档。

(2) 应用如上节制作模板中图1所示的模板。

(3) 在可编辑区域添加或编辑如图2所示的页面内容。

图2 未应用模板的商品展示页

应用模板之后的商品展示页的页面效果如图3所示：

图3 应用了模板的商品展示页

用模板制作“装备”商品的详细介绍页，步骤如示例2所示。

示例2:

(1) 新建要应用模板的空白文档。

(2) 应用如上节制作模板中图1所示的模板。

(3) 在可编辑区域添加未应用模板的商品的详细介绍页内容。

应用模板之后的商品的详细介绍页的页面效果如图4所示。

图4 应用了模板的商品的详细介绍页

用模板制作“购买页面”（即单击“立刻购买！”按钮后的页面），步骤如示例3所示。

示例3:

(1) 新建要应用模板的空白文档。

(2) 应用如上节制作模板中图1所示的模板。

(3) 在可编辑区域添加未应用模板的购买页面内容。

应用模板之后的购买页面的页面效果如图5所示。

图5 应用了模板的购买页面

本节作业：

参照教程和图示，使用Dreamweaver用模板页制作登录、注册页面。

注意事项：

1、整体规划样式的重要性。

2、模版区域：有可编辑区域、可选区域、可选可编辑区域等。

3、给文件夹、文件等取名要用字母标示。

网页学习网提示：光看教程是无法让你掌握HTML知识，最好是完成作业后才进入下一次教程，动起手来吧！

点击下载第七章案例及作业资源 返回《HTML入门经典》教程列表