第三章 企業(yè)產(chǎn)品介紹頁面的實現(xiàn)教學(xué)目標(biāo)l

掌握在網(wǎng)頁中建立各種超鏈接的方法l

掌握框架的基礎(chǔ)知識，創(chuàng)建各種類型的框架集并能根據(jù)需要修改框架l

掌握層的建立與設(shè)置，掌握層在排版中的應(yīng)用l

理解模板對于網(wǎng)站建設(shè)的重要性，掌握創(chuàng)建和修改模板的方法，能夠使用模板更新頁面l

掌握建立和應(yīng)用庫項目的方法企業(yè)產(chǎn)品頁面實例將現(xiàn)有文檔保存為模板

打開上章實例二中制作的“intro.htm”，將其中公司簡介部分內(nèi)容刪除，效果如圖所示，再將其保存為模板應(yīng)執(zhí)行以下操作：單擊“文件”菜單中的“另存為模板”命令，在“另存為”域中為該模板輸入名稱“模板1”

插入可編輯區(qū)域

定義模板后，就要指定模板的哪個部分可編輯，以便在其中添加內(nèi)容，因為默認(rèn)情況下，整個模板處于鎖定狀態(tài)?？删庉嬆０鍏^(qū)域指在創(chuàng)建基于模板的頁面時，模板使用者可以編輯哪些區(qū)域。

在“文檔”窗口中，選擇右側(cè)空白單元格中的上面的一個。單擊“插入”菜單中的“模板對象”命令，選擇“可編輯區(qū)域”命令，打開“新建可編輯區(qū)域”對話框。在“名稱”文本框中為該區(qū)域輸入唯一的名稱，“EditRegion1”，注意不要在“名稱”文本框中使用特殊字符?；谀０鍎?chuàng)建新的文檔

在“新建文檔”對話框中選擇“模板”選項卡，在左側(cè)的“模板用于”列表中選擇“沈陽電纜廠石家莊銷售處”站點。從中間的模板列表中選擇“模板1”，右側(cè)的“預(yù)覽”窗口中將顯示該模板。選中“當(dāng)模板改變時更新頁面”復(fù)選框，如果不希望在每次更改模板后Dreamweaver都更新基于該模板的頁面，可取消選擇“當(dāng)模板改變時更新頁面”復(fù)選框，那樣該文檔將不再以模板文件“.dwt”形式存在，而是成為一個獨(dú)立的HTML文檔。基于模板創(chuàng)建新的文檔單擊“創(chuàng)建”按鈕，基于選定模板的新文檔出現(xiàn)在“文檔”窗口中，如圖所示。添加產(chǎn)品介紹頁面的內(nèi)容

1、將新建文檔保存為“chanpin.htm”，在第一個可編輯區(qū)域中插入“a2.gif”，在第二行的可編輯區(qū)域中插入一個8行2列，“寬度”為“500”，邊框為“0”的表格，并在屬性面板中設(shè)置其水平居中對齊，設(shè)置各單元格高度為30。添加產(chǎn)品介紹頁面的內(nèi)容

2、合并新建表格第二列的8行單元格，并在左邊的8行中分別輸入各種產(chǎn)品名稱，（6-110kV交聯(lián)聚乙烯絕緣電力電纜、0.6/1KV交聯(lián)聚乙烯絕緣電力電纜、聚氯乙烯絕緣電力電纜、聚氯乙烯絕緣控制電纜、架空絕緣電纜、聚氯乙烯絕緣電纜（電線）、橡套電纜、特控電纜），選中左邊的8個單元格，應(yīng)用在上一個網(wǎng)頁中創(chuàng)建的樣式“.wen”，并分別為每種產(chǎn)品的名稱建立鏈接為“chanpin1.htm”至“chanpin8.htm”添加產(chǎn)品介紹頁面的內(nèi)容3、在新建表格的右單元格新建一個2行1列的表格，寬度為“200像素”，邊框線為“0”，水平居中。分別在兩個單元格中插入圖片“chanpin1.jpg”和“chanpin2.jpg”，設(shè)計效果如圖所示

創(chuàng)建建每每一一種種產(chǎn)產(chǎn)品品的的介介紹紹頁頁面面1、、先先創(chuàng)創(chuàng)建建基基于于新新建建模模板板網(wǎng)網(wǎng)頁頁文文檔檔，，并并將將其其保保存存為為““chanpin1.htm””文文件件，，在第第一一個個可可編編輯輯區(qū)區(qū)域域中中插插入入““a2.gif””，在在第第二二行行的的可可編編輯輯區(qū)區(qū)域域中中插插入入一一個個寬寬度度為為““600像像素素””，，3行行1列列，，間間距距設(shè)設(shè)““2””，，邊邊框框為為““0””的的表表格格，，使使其其水水平平居居中中。。將將第第一一行行拆拆分分成成兩兩列列，，再再將將第第一一行行右右邊邊單單元元格格拆拆分分成成兩兩行行，，如如圖圖所所示示。。創(chuàng)建建每每一一種種產(chǎn)產(chǎn)品品的的介介紹紹頁頁面面2、、將將新新建建表表格格中中第第一一行行左左邊邊列列的的寬寬度度設(shè)設(shè)為為““40%””，，并并在在其其中中插插入入產(chǎn)產(chǎn)品品圖圖片片““chanpin01.jpg””，，右右邊邊單單元元格格分分別別插插入入產(chǎn)產(chǎn)品品名名稱稱、、編編號號及及用用途途等等內(nèi)內(nèi)容容。。在在第第二二行行插插入入產(chǎn)產(chǎn)品品其其他他信信息息。。3、、在在具具體體的的產(chǎn)產(chǎn)品品介介紹紹中中還還應(yīng)應(yīng)有有參參數(shù)數(shù)說說明明的的表表格格，，我我們們可可以以根根據(jù)據(jù)具具體體情情況況插插入入表表格格，，比比如如在在第第二二行行表表格格中中插插入入一一個個新新的的表表格格，，并并將將表表格格的的寬寬度度應(yīng)應(yīng)設(shè)設(shè)為為““600像像素素””，，邊邊框框可可設(shè)設(shè)為為““1””，，可可將將表表頭頭和和表表體體設(shè)設(shè)為為不不同同的的顏顏色色以以示示區(qū)區(qū)別別，，如如表表頭頭可可設(shè)設(shè)為為““#80BFDB””色色；；表表體體可可設(shè)設(shè)為為““#FFFFEE””色色，，設(shè)設(shè)計計效效果果如如圖圖所所示示。。創(chuàng)建建每每一一種種產(chǎn)產(chǎn)品品的的介介紹紹頁頁面面在下下面面再再插插入入一一個個表表格格，，表表頭頭設(shè)設(shè)為為““#99CCCC””色色，，；；表表體體可可設(shè)設(shè)為為““#FFFFEE””色色，，輸輸入入相相應(yīng)應(yīng)的的文文字字。。創(chuàng)建建每每一一種種產(chǎn)產(chǎn)品品的的介介紹紹頁頁面面5、、由由于于頁頁面面內(nèi)內(nèi)容容過過多多，，頁頁面面過過長長，，應(yīng)應(yīng)在在頁頁尾尾加加一一個個返返回回頁頁首首的的鏈鏈接接，，即即在在第第一一個個可可編編輯輯區(qū)區(qū)域域中中插插入入一一個個名名為為““top””的的錨錨點點，，在在第第三三行行表表格格中中插插入入圖圖片片““top.htm””，，選選中中新新插插入入的的圖圖片片后后，，在在圖圖片片的的屬屬性性面面板板中中的的““鏈鏈接接””文文本本框框中中輸輸入入““#top””。。創(chuàng)建建每每一一種種產(chǎn)產(chǎn)