通過DreamweaverCS3學(xué)習(xí)HTML+DIV+CSS教學(xué)第17章 模板制作與應(yīng)用ppt課件

1、第17章 模板制造與運(yùn)用在實(shí)踐的網(wǎng)頁(yè)制造過程中，有時(shí)會(huì)遇到很多的頁(yè)面如不同的欄目具有一樣的規(guī)劃。制造時(shí)為了防止這種反復(fù)的操作，設(shè)計(jì)者可以運(yùn)用Dreamweaver CS3提供的“模板功能，將具有一樣整體規(guī)劃構(gòu)造的頁(yè)面制形成模板，將一樣的規(guī)劃對(duì)象如頁(yè)面頭部，頁(yè)腳等制形成庫(kù)文件。這樣，當(dāng)設(shè)計(jì)者再次制造該頁(yè)面時(shí)，可以直接運(yùn)用庫(kù)文件，從而可以節(jié)省很多不用要的反復(fù)操作。本章將從模板簡(jiǎn)介、模板的制造和模板的運(yùn)用三個(gè)方面對(duì)模板進(jìn)薪檣堋17.1 模板簡(jiǎn)介Dreamweaver CS3中的模板是一種特殊類型的文檔，它用于設(shè)計(jì)規(guī)劃比較固定的頁(yè)面。用戶可以創(chuàng)建基于模板的頁(yè)面規(guī)劃。17.1.1 模板的作用模板最大的作

2、用就是可以大大提高設(shè)計(jì)者的任務(wù)效率。當(dāng)設(shè)計(jì)者對(duì)模板進(jìn)展修正后，一切運(yùn)用了這個(gè)模板的網(wǎng)頁(yè)內(nèi)容都將隨之被修正。簡(jiǎn)單地說，就是一次可以更新多個(gè)頁(yè)面，這也是模板強(qiáng)大的功能之一。在實(shí)踐任務(wù)中，尤其是針對(duì)一些大型的網(wǎng)站，其效果更是非常明顯。所以，模板與基于模板的網(wǎng)頁(yè)之間堅(jiān)持了一種銜接的形狀，這兩者之間共同的內(nèi)容也將可以堅(jiān)持完全的一致。17.1.2 適宜運(yùn)用模板的網(wǎng)頁(yè)假設(shè)一個(gè)網(wǎng)站的規(guī)劃比較一致，擁有一樣的導(dǎo)航，且顯示不同欄目?jī)?nèi)容的位置根本堅(jiān)持不變，那么這種規(guī)劃的網(wǎng)站就可以思索運(yùn)用模板來創(chuàng)建。這類似于前面章節(jié)中引見的框架技術(shù)。有些類型的網(wǎng)站采用框架技術(shù)或模板技術(shù)，最終的效果根本一樣。例如，下面的網(wǎng)站就適宜采用

3、模板來進(jìn)展規(guī)劃，如下圖。這些頁(yè)面雖然是不同的欄目，擁有不同的內(nèi)容，但卻具有一樣的規(guī)劃版式。 適宜運(yùn)用模板的規(guī)劃?rùn)谀恳?適宜運(yùn)用模板的規(guī)劃?rùn)谀慷?17.2 模板元素的操作模板實(shí)踐上就是一種文檔，其擴(kuò)展名為.dwt，存放在根目錄下的Templates文件夾中。假設(shè)該文件夾在站點(diǎn)中不存在，Dreamweaver將會(huì)在保管新建模板時(shí)自動(dòng)創(chuàng)建。17.2.1 創(chuàng)建模板在Dreamweaver CS3中有兩種創(chuàng)建模板的方法：一種是將現(xiàn)有的網(wǎng)頁(yè)文件另存為模板，然后根據(jù)需求進(jìn)展修正；另一種是直接新建一個(gè)空白模板，再在其中插入需求顯示的文檔內(nèi)容。下面就以前做過的頁(yè)面頭部、主體版面和頁(yè)腳構(gòu)成的頁(yè)面為例，分別運(yùn)用兩種

4、方法將其制形成模板文件。1運(yùn)用網(wǎng)頁(yè)另存為的方法創(chuàng)建模板運(yùn)用網(wǎng)頁(yè)另存為的方法創(chuàng)建模板的詳細(xì)步驟如下： 17.2.1 創(chuàng)建模板2運(yùn)用新建空白模板的方法創(chuàng)建模板運(yùn)用新建空白模板的方法創(chuàng)建模板的詳細(xì)步驟如下：17.2.2 創(chuàng)建可編輯區(qū)域創(chuàng)建模板后接著要進(jìn)展的操作是創(chuàng)建可編輯區(qū)域?？删庉媴^(qū)域可以控制模板頁(yè)面哪些區(qū)域可以編輯，哪些區(qū)域不可以編輯。模板的可編輯區(qū)域主要包括以下操作。1插入可編輯區(qū)域插入可編輯區(qū)域的詳細(xì)步驟如下： 17.2.2 創(chuàng)建可編輯區(qū)域2選擇可編輯區(qū)域圖 直接選擇可編輯區(qū)域在模板文檔和基于模板文檔中，都可以很容易地標(biāo)識(shí)和選擇模板區(qū)域。選擇的方法可分為兩種：直接選擇和菜單項(xiàng)選擇擇。17.2

5、.2 創(chuàng)建可編輯區(qū)域3刪除可編輯區(qū)域假設(shè)曾經(jīng)將模板文件的一個(gè)區(qū)域標(biāo)志為可編輯，而如今想再次鎖定它使其在基于模板的文件中不可編輯，可先選中該可編輯區(qū)域，然后單擊【修正】|【模板】|【刪除模板標(biāo)志】命令，可編輯區(qū)域即會(huì)被刪除，而之前其中的內(nèi)容會(huì)被保管。假設(shè)要?jiǎng)h除某個(gè)可編輯區(qū)域和其中的內(nèi)容，選中該可編輯區(qū)域后按Delete鍵即可。17.2.2 創(chuàng)建可編輯區(qū)域4更改可編輯區(qū)域的稱號(hào)曾經(jīng)插入的可編輯區(qū)域依然可以再次更改它的稱號(hào)。詳細(xì)的操作步驟如下：17.2.3 創(chuàng)建基于模板的文檔在創(chuàng)建模板后，就可以向空白文檔中運(yùn)用模板了。創(chuàng)建基于模板的新文檔有很多方法，如可以運(yùn)用【資源】浮動(dòng)面板，或單擊菜單【文件】|【

6、新建】命令。本章主要引見【資源】浮動(dòng)面板的方法，其他方法也大同小異，讀者可以本人進(jìn)展嘗試。運(yùn)用【資源】浮動(dòng)面板創(chuàng)建基于模板文檔的詳細(xì)操作步驟如下：17.2.4 分別文檔中運(yùn)用的模板假設(shè)要更改基于母本的文檔的鎖定區(qū)域，必需將該文檔從模板中分別。將文檔分別后，整個(gè)文檔中的內(nèi)容都將變?yōu)榭删庉嫷男螤?。分別文檔中的模板詳細(xì)的操作步驟如下：17.2.5 更新模板及基于模板的網(wǎng)頁(yè)更改并保管模板時(shí)，Dreamweaver CS3可以自動(dòng)更新基于該模板的一切文檔。讀者也可以手動(dòng)更新這些文檔。更新模板的詳細(xì)操作步驟如下：17.2.6 模板的嵌套與表格和層一樣，模板也可以進(jìn)展嵌套。嵌套模板是根本模板的一種擴(kuò)展。讀者

7、可以經(jīng)過保管一個(gè)基于模板的文檔，然后將該文檔另存為一個(gè)新模板的方式來嵌套模板。嵌套多個(gè)模板會(huì)使規(guī)劃變得更加準(zhǔn)確。圖17.19 單擊【從模板新建】命令在默許情況下，根本模板中的一切可編輯區(qū)域都將經(jīng)過嵌套模板傳送到基于該嵌套模板的文檔中。這意味著假設(shè)在根本模板中創(chuàng)建一個(gè)可編輯區(qū)域，然后再創(chuàng)建一個(gè)嵌套模板，只需讀者沒有在嵌套模板的區(qū)域中插入新的可編輯區(qū)域，那么原可編輯區(qū)域?qū)?huì)出如今基于嵌套模板的文檔中。 17.3 模板的運(yùn)用實(shí)踐中運(yùn)用模板，首先需求分析該模板中適宜插入的可編輯區(qū)域的分布，也就是欄目之間擁有不同內(nèi)容的位置。普通網(wǎng)頁(yè)的不同大部分都位于頁(yè)面的主體部分。然后，編輯可編輯區(qū)域，以制造適宜特定欄

8、目的頁(yè)面。在上一節(jié)中引見了模板的操作方法，在本節(jié)中，將根據(jù)之前制造的頁(yè)面講解模板的運(yùn)用。 17.3.1 分析規(guī)劃翻開之前創(chuàng)建的模板文檔muban.dwt，如下圖。此頁(yè)面是一個(gè)作品展現(xiàn)頁(yè)，各欄目頁(yè)面的不同主要是作品展現(xiàn)欄的不同。17.3.2 插入可編輯區(qū)域刪除了主體版面相關(guān)內(nèi)容之后，需求在模板中創(chuàng)建可編輯區(qū)域，以便在后面的步驟中可以對(duì)基于模板的文檔進(jìn)展編輯。詳細(xì)操作步驟如下：17.3.3 運(yùn)用模板設(shè)置模板后就可以運(yùn)用這個(gè)模板了。詳細(xì)操作步驟如下： 17.3.3 運(yùn)用模板至此基于模板創(chuàng)建的欄目頁(yè)就制造完成了，可以發(fā)現(xiàn)，制造的步驟簡(jiǎn)單了許多，只需求做簡(jiǎn)單的文字輸入和圖片插入，大大提高了任務(wù)效率。 17.4 專家總結(jié)本章主