一、模板
做一個網站,有時候很重要的一點就是整個網站的風格要統一。一些網頁的版式都是相同的。
其中標題和下面的一排按鈕,還有表格的編排方式,還有里面已經制作好的9磅CSS樣式,這些風格都是固定的。新作一張網頁上面這些都不變,而只要替換文字和一些圖片就行了。按照我們的習慣方法是重新做一張,經過漫長和痛苦的等待,終于做成了和前面一模一樣的網頁。這時發現還有N張網頁也要同樣制作。
這時候,我們就需要用到模板,他可以將網頁中不變的元素固定下來,然后用來應用到其他的網頁上去。這樣我們只要修改相應的部分就可以了無需再痛苦萬分的一切重來了。模板可以由一個網頁來生成。制作過程如下:
1、 制作好一個頁面。
上面凡是不需要變化的元素都統一在圖上做好了。
2、 選擇菜單File→Save As Template(另存為模板)。
系統彈出對話框。在Save As文本框中填寫模板名字,按Save。
3、 如果仔細觀察標題欄的話會發現標題欄上已經發生了變化。<>表示現在編輯的是模板了。模板的擴展名也是.dwt。
4、 接下來我們要做的一個重要工作就是設置可編輯區域。如果現在直接存盤的話,這個模板生成的頁面是無法進行內容修改的。因為沒有指定什么地方是可以修改的。只有設置了可編輯區域,我們以后編輯網頁的時候才能夠對網頁進行修改。在這個例子中,三個表格中的單元格是要可以替換內容的。因此就對這三個單元格設置可編輯區域。在一個單元格中單擊。選擇菜單Modify→Templates→New Editable Region(新可編輯區域)。在系統彈出的對話框中填入可編輯區域名稱。按OK。在頁面中就生成了一個{}包圍的可編輯區域的標記。
5、 同樣制作其他兩個單元格為可編輯區域。
6、 保存模板,系統彈出提示框,“對模板進行了修改,保存后是否自動更新所有應用改模板的網頁”。選擇是,系統會進行搜索,并報告搜索結果。確認即可。一個模板就做好了。
如何應用一個模板到頁面呢?
1、 新建一個空白頁面。
2、 選擇菜單window→Templates打開模板面板。單擊做好的模板。按面板上的Apply按鈕即可。
3、 其中,頁面中的黃色部分就是模板的不可編輯區域。將頁面中{}包含的部分刪去。填上相應的內容。一個頁面就做好了。
由此可見模板有很多的好處。1、可以生成大批的風格相近的網頁。2、一旦模板修改了,就修改了一批網頁。模板修改完畢存盤時,會跳出一個對話框提示是否要把修改的模板重新應用到網頁上去。選擇Update按鈕,就把模板全部重新應用了這樣的話,修改了一個頁面就修改了整個網站的頁面。是大大提高效率的。要編輯模板只要在模板面板中雙擊模板即可。
有的時候我們制作了一個應用模板的網頁。但是我們想對網頁的不可編輯區域進行修改的話,需要把模板和網頁進行分離。在網頁中選擇菜單Modify→Template→Detach From Template分離模板即可。這時就和一般的網頁一樣可以自由編輯了。
二、庫
和模板有異曲同工之妙的就是庫。模板可以用來制作整體網頁的重復部分。庫就是面向網頁局部重復部分的。例如,在某些頁面上要寫上 XXXX版權所有,歡迎mail我之類的話。每次重復輸入這些東西是讓人惱火的。我們可以把這些東東做成庫部件。以后重復使用。制作方法:我們以制作版權信息為例。
1、 輸入文字和信息
2、 選擇菜單window→Library打開庫面板。選中文字。拖拽進入面板,命名即可。圖中黃色部分即為庫部件。已經變為整體了。
以后要插入庫部件的時候,只要在庫面板中單擊改部件,選擇Insert按鈕就可以完成部件插入。編輯部件只要在面板中雙擊部件就可以了。同樣修改了一個部件,系統會提示是否重新應用到所有使用庫部件的頁面。按Update按鈕即可完成。大家可以注意到,一旦使用了庫和模板之后。在站點根目錄下就多了兩個目錄。Templates目錄為模板目錄,所有擴展名為dwt的模板都存放在里面。Library目錄為庫目錄,庫部件擴展名為.lbi。
Dreamweaver教程我們已基本講解完成,我們將在以后的文章中繼續深入了解Dreamweaver的一些技巧操作。也由衷地希望你能編制出更為漂亮的網頁,記得讓我們與你共同分享噢!如果你需要幫助的話,請你與我們保持聯系。
三、Dnawo注:代碼中如何區別模板與庫?
模板的代碼形如:
<!-- InstanceBegin template="/Templates/xxx.dwt" codeOutsideHTMLIsLocked="false" -->
<!-- InstanceBeginEditable name="edit1" --><!-- InstanceEndEditable -->
<!-- InstanceEnd -->
庫的代碼形如:
<!-- #BeginLibraryItem "/Library/xxx.lbi" --><!-- #EndLibraryItem -->
做一個網站,有時候很重要的一點就是整個網站的風格要統一。一些網頁的版式都是相同的。
其中標題和下面的一排按鈕,還有表格的編排方式,還有里面已經制作好的9磅CSS樣式,這些風格都是固定的。新作一張網頁上面這些都不變,而只要替換文字和一些圖片就行了。按照我們的習慣方法是重新做一張,經過漫長和痛苦的等待,終于做成了和前面一模一樣的網頁。這時發現還有N張網頁也要同樣制作。
這時候,我們就需要用到模板,他可以將網頁中不變的元素固定下來,然后用來應用到其他的網頁上去。這樣我們只要修改相應的部分就可以了無需再痛苦萬分的一切重來了。模板可以由一個網頁來生成。制作過程如下:
1、 制作好一個頁面。
上面凡是不需要變化的元素都統一在圖上做好了。
2、 選擇菜單File→Save As Template(另存為模板)。
系統彈出對話框。在Save As文本框中填寫模板名字,按Save。
3、 如果仔細觀察標題欄的話會發現標題欄上已經發生了變化。<>表示現在編輯的是模板了。模板的擴展名也是.dwt。
4、 接下來我們要做的一個重要工作就是設置可編輯區域。如果現在直接存盤的話,這個模板生成的頁面是無法進行內容修改的。因為沒有指定什么地方是可以修改的。只有設置了可編輯區域,我們以后編輯網頁的時候才能夠對網頁進行修改。在這個例子中,三個表格中的單元格是要可以替換內容的。因此就對這三個單元格設置可編輯區域。在一個單元格中單擊。選擇菜單Modify→Templates→New Editable Region(新可編輯區域)。在系統彈出的對話框中填入可編輯區域名稱。按OK。在頁面中就生成了一個{}包圍的可編輯區域的標記。
5、 同樣制作其他兩個單元格為可編輯區域。
6、 保存模板,系統彈出提示框,“對模板進行了修改,保存后是否自動更新所有應用改模板的網頁”。選擇是,系統會進行搜索,并報告搜索結果。確認即可。一個模板就做好了。
如何應用一個模板到頁面呢?
1、 新建一個空白頁面。
2、 選擇菜單window→Templates打開模板面板。單擊做好的模板。按面板上的Apply按鈕即可。
3、 其中,頁面中的黃色部分就是模板的不可編輯區域。將頁面中{}包含的部分刪去。填上相應的內容。一個頁面就做好了。
由此可見模板有很多的好處。1、可以生成大批的風格相近的網頁。2、一旦模板修改了,就修改了一批網頁。模板修改完畢存盤時,會跳出一個對話框提示是否要把修改的模板重新應用到網頁上去。選擇Update按鈕,就把模板全部重新應用了這樣的話,修改了一個頁面就修改了整個網站的頁面。是大大提高效率的。要編輯模板只要在模板面板中雙擊模板即可。
有的時候我們制作了一個應用模板的網頁。但是我們想對網頁的不可編輯區域進行修改的話,需要把模板和網頁進行分離。在網頁中選擇菜單Modify→Template→Detach From Template分離模板即可。這時就和一般的網頁一樣可以自由編輯了。
二、庫
和模板有異曲同工之妙的就是庫。模板可以用來制作整體網頁的重復部分。庫就是面向網頁局部重復部分的。例如,在某些頁面上要寫上 XXXX版權所有,歡迎mail我之類的話。每次重復輸入這些東西是讓人惱火的。我們可以把這些東東做成庫部件。以后重復使用。制作方法:我們以制作版權信息為例。
1、 輸入文字和信息
2、 選擇菜單window→Library打開庫面板。選中文字。拖拽進入面板,命名即可。圖中黃色部分即為庫部件。已經變為整體了。
以后要插入庫部件的時候,只要在庫面板中單擊改部件,選擇Insert按鈕就可以完成部件插入。編輯部件只要在面板中雙擊部件就可以了。同樣修改了一個部件,系統會提示是否重新應用到所有使用庫部件的頁面。按Update按鈕即可完成。大家可以注意到,一旦使用了庫和模板之后。在站點根目錄下就多了兩個目錄。Templates目錄為模板目錄,所有擴展名為dwt的模板都存放在里面。Library目錄為庫目錄,庫部件擴展名為.lbi。
Dreamweaver教程我們已基本講解完成,我們將在以后的文章中繼續深入了解Dreamweaver的一些技巧操作。也由衷地希望你能編制出更為漂亮的網頁,記得讓我們與你共同分享噢!如果你需要幫助的話,請你與我們保持聯系。
三、Dnawo注:代碼中如何區別模板與庫?
模板的代碼形如:
<!-- InstanceBegin template="/Templates/xxx.dwt" codeOutsideHTMLIsLocked="false" -->
<!-- InstanceBeginEditable name="edit1" --><!-- InstanceEndEditable -->
<!-- InstanceEnd -->
庫的代碼形如:
<!-- #BeginLibraryItem "/Library/xxx.lbi" --><!-- #EndLibraryItem -->
更多文章、技術交流、商務合作、聯系博主
微信掃碼或搜索:z360901061

微信掃一掃加我為好友
QQ號聯系: 360901061
您的支持是博主寫作最大的動力,如果您喜歡我的文章,感覺我的文章對您有幫助,請用微信掃描下面二維碼支持博主2元、5元、10元、20元等您想捐的金額吧,狠狠點擊下面給點支持吧,站長非常感激您!手機微信長按不能支付解決辦法:請將微信支付二維碼保存到相冊,切換到微信,然后點擊微信右上角掃一掃功能,選擇支付二維碼完成支付。
【本文對您有幫助就好】元
