《網頁設計內容與制作》.ppt

《網頁設計內容與制作》.ppt

ID:51636672

大?。?.50 MB

頁數:21頁

時間:2020-03-27

《網頁設計內容與制作》.ppt_第1頁
《網頁設計內容與制作》.ppt_第2頁
《網頁設計內容與制作》.ppt_第3頁
《網頁設計內容與制作》.ppt_第4頁
《網頁設計內容與制作》.ppt_第5頁
資源描述:

《《網頁設計內容與制作》.ppt》由會員上傳分享,免費在線閱讀,更多相關內容在行業(yè)資料-天天文庫。

1、《網頁設計與制作》第七章模板與庫的應用7.37.47.57.17.2實例導入:利用模板生成的站點創(chuàng)建模板模板的應用和更新使用庫利用模板和庫生成站點的制作過程本章主要介紹了利用模板和庫設計風格一致的網站,使用模板和庫的組合使得建設網站和維護網站變得很輕松,尤其是在對一個規(guī)模較大的網站進行建設與維護時,就能體會到模板和庫的好處?!颈菊聦W習目的】本章通過一個典型的網站案例重點講解了模板和庫技術的應用,通過本章的學習,掌握利用模板和庫技術創(chuàng)建風格一致的網站的方法。一個成功的網站首先要具備自己獨特的風格,才能夠在茫茫的網絡中脫穎而出,給人留下深刻的印象。但僅憑網站中的一兩個較好的頁面

2、,很難收到良好的效果。因此就需要整個站點內的頁面體現出統(tǒng)一的風格。因此通過使用模板能夠生成多個具有相似結構和外觀網頁,從而提高網頁制作效率?!纠?.1】利用模板技術生成網站實例,如圖7.1所示。在本網站實例主要涉及到以下知識點:首先進行網頁版面布局的設計;劃分模板鎖定區(qū)域和可編輯區(qū)域;創(chuàng)建模板和編輯模板,最后根據模板快速創(chuàng)建網頁。7.2創(chuàng)建和設置模板關于模板最顯著的特征就是鎖定區(qū)域和可編輯區(qū)域之分。鎖定區(qū)域主要用來鎖定體現網站風格部分,而將經常要改變的文字、圖像、鏈接等網頁元素設置成可編輯區(qū)域,網頁中只編輯可編輯區(qū)域的內容,從而得到與模板相似但又有所不同的新的網頁。7.2.

3、1創(chuàng)建模板創(chuàng)建模板有二種常用的方法:一是創(chuàng)建新模板,二是將當前網頁另存為模板。1.創(chuàng)建新模板創(chuàng)建新模板可通過以下兩種方法來實現:方法一:選擇“文件”菜單|“新建”命令,彈出“新建文檔”對話框中,選擇“常規(guī)”選項卡|“基本頁”|“HTML模板”,單擊“創(chuàng)建”按鈕,方法二:選擇“窗口”菜單|“資源”命令,或按F11鍵打開“資源”面板,單擊“資源”面板左邊的“模板”選項,單擊右下角的新建模板按鈕,如圖所示。2.將當前文檔另存為模板將一個編輯好的網頁按照要求加以修改,然后另存為模板。7.2.2編輯模板首先劃分可編輯區(qū)域和鎖定區(qū)域,然后編輯模板,通常是像編輯網頁一樣先將鎖定區(qū)域編輯好

4、,然后再定義可編輯區(qū)域??删庉媴^(qū)域:在模板中可編輯區(qū)域對應網頁中的可編輯部分,鎖定區(qū)域是那些不可編輯的部分。在默認的方式下,Dreamweaver將新模板的所有部分設置為不可編輯區(qū)域,由用戶來定義可編輯區(qū)域。在編輯模板時,無論是可編輯區(qū)域還是鎖定區(qū)域都是可以編輯的。但是將模板應用到網頁中,在網頁中的鎖定區(qū)域是不可以編輯的。常用定義可編輯區(qū)域的方法有二種,首先在模板中將光標單擊要新建可編輯區(qū)域位置,選擇“插入”菜單|“模板對象”|“可編輯區(qū)域”命令,或單擊“插入”欄|“常用”選項|“模板”|“可編輯區(qū)域”按鈕,彈出一個“新建可編輯區(qū)域”對話框,如圖所示,輸入這個區(qū)域的名稱,單

5、擊“確定”按鈕。7.3模板的應用和更新利用模板快速生成新的網頁,也可以將模板應用于已經存在的網頁。7.3.2模板的更新1.模板的修改模板創(chuàng)建后,用戶利用模板生成了網頁文件。在網頁文件的編輯過程中可能會有一些不合適的地方,比如:鏈接有錯誤、網頁布局中單元格對齊方式不合理、圖像不能正常顯示等,而對于鎖定區(qū)域,是無法在網頁編輯狀態(tài)進行修改,因此需要對模板進行修改。打開模板文件,對模板文件進行修改,針對在網頁編輯中發(fā)現的問題進行修改。修改模板:對鎖定區(qū)域進行修改。刪除可編輯區(qū)域:在模板編輯狀態(tài),選中已定義的可編輯區(qū)域,選擇“修改”菜單|“模板”|“刪除模板標記”命令,該可編輯區(qū)域就

6、不存在了。2.用模板更新網頁和網站一旦模板被應用到多個網頁文檔中,對此模板的修改則會更新全部與其相關聯的文檔。這種使用模板更新文件的方法大大節(jié)省了用戶的時間,尤其在涉及大量的改動時極為有效。7.4使用庫Dreamweaver中提供了庫的概念。庫是用來存儲想要在整個網站上經常重復使用或更新的網頁元素,其它網頁可調用庫文件。這樣一旦需要修改重復使用的部分,只需要修改庫文件,而其它調用此庫的頁面將會被全部更新。7.4.1創(chuàng)建庫庫項目可以包含多種網頁元素,如:圖像、鏈接、表格、腳本等,但CSS樣式表文件不能作為庫項目添加到庫。創(chuàng)建庫的常用方法有三種:方法一:選擇“窗口”菜單|“資源

7、”命令,打開“資源”面板,選擇“庫”選項,單擊“資源”面板下方的“新建庫項目”按鈕。方法一:選擇“文件”菜單|“新建”命令,彈出“新建文檔”對話框,選擇“常規(guī)”選項卡|“基本頁”|“庫項目”命令,單擊“創(chuàng)建”按鈕,如圖所示。方法三:將已經編輯好的網頁元素轉換為庫文件,首先選中要轉換為庫文件的網頁元素,然后選擇“修改”菜單|“庫”|“增加對象到庫”命令,當前選中的網頁元素就會成為一個新的庫項目以供其它網頁調用。創(chuàng)建庫文件后,站點中就會多出子文件夾library,庫文件的默認存儲路徑就是該文件夾。庫文件的后綴名為lbi

當前文檔最多預覽五頁,下載文檔查看全文

此文檔下載收益歸作者所有

當前文檔最多預覽五頁,下載文檔查看全文
溫馨提示:
1. 部分包含數學公式或PPT動畫的文件,查看預覽時可能會顯示錯亂或異常,文件下載后無此問題,請放心下載。
2. 本文檔由用戶上傳,版權歸屬用戶,天天文庫負責整理代發(fā)布。如果您對本文檔版權有爭議請及時聯系客服。
3. 下載前請仔細閱讀文檔內容,確認文檔內容符合您的需求后進行下載,若出現內容與標題不符可向本站投訴處理。
4. 下載文檔時可能由于網絡波動等原因無法下載或下載錯誤,付費完成后未能成功下載的用戶請聯系客服處理。