1、第 15講 布局技術(shù)-模板、庫二1.1 教學(xué)目標(biāo)：知識目標(biāo)1. 掌握模板的基本操作2. 掌握基于模板更新頁面的方法3. 掌握庫的創(chuàng)建和應(yīng)用技能目標(biāo)1. 能合理運用模板2. 使用模板更新頁面3. 能使用資源面板管理模板和庫品質(zhì)目標(biāo)培養(yǎng)學(xué)生認(rèn)真細(xì)致、踏實進取的精神1.2 教學(xué)重點：1. 使用模板更新頁面2. 能使用資源面板管理模板和庫1.3 教學(xué)難點理解可編輯區(qū)域的作用，使用模板更新頁面。1.4 教學(xué)方法：講練結(jié)合，任務(wù)驅(qū)動、分子任務(wù)操練1.5 課時安排：2課時1.6 教學(xué)對象分析：這個班學(xué)生具有基本專業(yè)技能，不僅僅是要教會他們方法，最重要的是教會他們的規(guī)范的動手能力與各種事件多方法的靈活處理能力

2、，在保證全班同學(xué)教學(xué)進度一致的情況上，培養(yǎng)學(xué)生較好的專業(yè)基礎(chǔ)與創(chuàng)新創(chuàng)作意識。1.7 教學(xué)過程：一、激趣導(dǎo)入，揭示課題對于一個網(wǎng)站的多個頁面文件，經(jīng)常出現(xiàn)布局一致的情況，甚至網(wǎng)頁的一些部分是完全相同的，比如導(dǎo)航欄、標(biāo)題欄等，利用Dreamweave 中的模板可以方便快捷地創(chuàng)建大量風(fēng)格統(tǒng)一、布局一致的網(wǎng)頁，運用方便靈活的庫文件，可省去設(shè)計者大量的重復(fù)工作。二、使用模板更新頁面在通過模板創(chuàng)建了若干個頁面之后，如果需要更改頁面或者增加欄目，我們可以通過Dreamweaver MX 2004 的模板修改功能來解決這個問題。當(dāng)你對模板不滿意，只需修改模板。Dreamweaver MX 2004 能自動更新

3、所有用模板制作的頁面，而不需要一個一個地進行修改。比如我們在模板面板選擇Templates對模板進行了修改之后，運行“文件/保存”命令來保存模板，這時候會彈出“更新模板文件”提示框詢問是否更新所有使用了該模板的頁面如 圖 3-14 所示。圖3-14使用模板更新頁面確認(rèn)之后就會彈出“更新頁面”對話框，顯示出更新的頁面總數(shù)以及更新的時間等信息。 如圖3-15所示。杳君R 文片用-* 上海生桂1,麻；匚而至同q導(dǎo)西J口衲s1：刁工子父國 '生蚊赤：htduAst?unJIUTlrxqtdnl圖3-15更新完成后顯不更新信息提示：Dreamweaver MX 2004提供的為頁面更換模板的功能

4、，有點像給人換衣服，只要把各種模板制作好，然后想穿哪件就穿哪件。具體的更換模板方法也很簡單，只要在模板面板 的列表區(qū)域挑選合適的模板，然后點擊“應(yīng)用”按鈕，這樣就可以很快完成模板更換操作了。 三、管理模板使用“資源”面板的“模板”類別除了可以將模板應(yīng)用于文檔或編輯模板，還可以管理 現(xiàn)有模板，包括重命名模板文件和刪除模板文件。四、使用庫項目很多頁面設(shè)計師都厭煩頻繁地改動網(wǎng)站，使用Dreamweaver的庫，可以很好的解決這個問題。庫和模板有異曲同工之妙，模板可以用來制作整體頁面的重復(fù)部分，而庫是用來制作 頁面局部重復(fù)部分的。如果使用了庫，就可以通過改動庫更新所有采用庫的頁面，不用一個 一個的修改

5、頁面元素或者重新制作頁面。使用庫比使用模板，有更大的靈活性。例如，在某些頁面上要寫上 XXXX版權(quán)所有，歡迎mail我之類的話。我們可以把這些文 字或圖像做成庫項目，以后就可以從庫中取出庫項目重復(fù)使用了。1庫的概念利用模板我們可以控制網(wǎng)站的風(fēng)格，這是所有的頁面存在的共性，而對于個性化的內(nèi)容， 使用庫項目可以為我們的工作提供便利。Dreamweaver提供了重復(fù)部件的功能， 這些重復(fù)部件可以反復(fù)使用，從而使我們能夠輕松完成某些需要重復(fù)制作或者需要經(jīng)常變動的內(nèi)容，幫助 頁面設(shè)計師用最短的時間來完成繁重的網(wǎng)站維護工作。這些重復(fù)部件我們通常稱之為“庫項目”。模板與庫項目存在的最本質(zhì)的區(qū)別就是：模板本質(zhì)

6、是一個頁面，也就是一個獨立的文件, 而庫項目則只是頁面中的某一段HTML代碼。執(zhí)行“窗口 /資源”命令，就會打開“資源”面板，在面板左則的一排按鈕中選擇“庫” 按鈕卬j,就會顯示庫面板。如圖 3-68所示。圖3-68 庫面板2創(chuàng)建庫項目創(chuàng)建庫的方法十分簡單，我們只要把頁面中要生成庫的元素，如表格、圖像，直接拖到 庫面板中，輸入庫項目的名稱即可。另外我們也可在庫面板中建立，步驟如下：1 .打開一個頁面文檔，選擇文檔的一部分，例如一個圖片。2 .在庫面板中單擊“新建庫項目”按鈕或單擊庫面板右上角的菜單按鈕，在彈出的菜單中選擇“新建庫項目”命令，在庫面板中就添加了一個名為Untitiled的庫項目。

7、給庫項目命名為Libraryl , 一個新的庫項目就建好了，如圖 3-69。圖3-69創(chuàng)建庫項目庫中的元素決不僅僅是圖像或文字本身，而且還包含了頁面中排列這些圖像的代碼。3應(yīng)用庫1 .插入庫項目我們可以像使用模板一樣，在頁面上添加相同的庫元素，從而批量生產(chǎn)風(fēng)格類似的頁面。 最簡單的方法是在庫面板中將元素拖回到新頁面上，而相關(guān)的代碼會自動復(fù)制到新頁面上。 同樣，我們也可在庫面板中建立，步驟如下：打開要應(yīng)用庫項目的文檔，將插入點放在要插入庫項目的位置。選擇一個庫項目，在庫面板中單擊“插入”按鈕L 插-I ,或單擊庫面板右上角的菜單按鈕，在彈出的菜單中選擇“插入”命令，則在文檔的插入點位置加入了庫項

8、目。2 .脫離庫文檔中由庫項目創(chuàng)建的元素，會隨著庫項目的變化而變化。如果我們修改了某個庫項目， 那么由這個庫項目創(chuàng)建的頁面元素也會自動更新。我們也可以讓文檔不受庫項目的控制，以 便可以自由地編輯。打開要操作的文檔，選擇文檔中由庫項目創(chuàng)建的頁面元素，則其屬性面板顯示如圖3-70所示。圖3-70庫元素的屬性面板單擊屬性面板的“從源文件中分離”按鈕，文檔中的元素就和庫脫離了。脫離了庫的元 素，庫的修改就不會再反映到該元素了。4修改庫和更新頁面庫元素也可以實現(xiàn)網(wǎng)站的批量更新，當(dāng)改變了庫元素并進行保存時，凡是使用了庫元素 的頁面，會自動進行同步更新。1 .在庫面板的列表窗口中選擇要修改的庫項目，如 Li

9、braryl ,單擊“編輯” *按鈕，則 打開該庫文件。2 .對庫文件稍作修改后保存該庫文件，就彈出“更新庫項目”對話框。如圖3-71所示。圖3-71更新庫項目對話框3 .單擊“更新”按鈕，則彈出“更新頁面”對話框，顯示更新信息，單擊“關(guān)閉”按鈕 關(guān)閉對話框就完成了頁面的更新。如圖3-72所示。圖3-72 更新頁面對話框若只想更新當(dāng)前文檔，可執(zhí)行“修改/庫/更新當(dāng)前頁”命令；若要更新多個使用了該庫的文檔, 或者整個網(wǎng)站上的所有使用了該庫的文檔，可執(zhí)行“修改/庫/更新頁面”命令。6管理模板使用“資源”面板的“模板”類別除了可以將模板應(yīng)用于文檔或編輯模板，還可以管理 現(xiàn)有模板，包括重命名模板文件和刪除模板文件。1.8 歸