Cha17項(xiàng)目指導(dǎo)——制作家居網(wǎng)頁(yè)

1、第第1717章章 項(xiàng)目指導(dǎo)項(xiàng)目指導(dǎo)制作制作家居網(wǎng)頁(yè)家居網(wǎng)頁(yè)（時(shí)間：（時(shí)間：2次課，次課，4學(xué)時(shí)）學(xué)時(shí)） 近幾年隨著房地產(chǎn)業(yè)的迅猛發(fā)展，與之相關(guān)的家居近幾年隨著房地產(chǎn)業(yè)的迅猛發(fā)展，與之相關(guān)的家居產(chǎn)業(yè)也發(fā)展繁榮，各大家居類(lèi)企業(yè)幾乎都有自己的網(wǎng)站，產(chǎn)業(yè)也發(fā)展繁榮，各大家居類(lèi)企業(yè)幾乎都有自己的網(wǎng)站，所以家居網(wǎng)站也隨之增多，本章將通過(guò)對(duì)家居網(wǎng)頁(yè)的制作所以家居網(wǎng)站也隨之增多，本章將通過(guò)對(duì)家居網(wǎng)頁(yè)的制作來(lái)講解來(lái)講解DreamwaverDreamwaver CC CC的使用，網(wǎng)頁(yè)制作完成后的效果，的使用，網(wǎng)頁(yè)制作完成后的效果，如圖如圖17.117.1所示。所示。 第第1717章章 項(xiàng)目指導(dǎo)項(xiàng)目指導(dǎo)制作制作家居

2、網(wǎng)頁(yè)家居網(wǎng)頁(yè)圖圖17.1 17.1 完成后的效果完成后的效果第第1717章章 項(xiàng)目指導(dǎo)項(xiàng)目指導(dǎo)制作制作家居網(wǎng)頁(yè)家居網(wǎng)頁(yè)n17.1 17.1 制作網(wǎng)頁(yè)頁(yè)面制作網(wǎng)頁(yè)頁(yè)面n17.2 17.2 為網(wǎng)頁(yè)添加鏈接和行為為網(wǎng)頁(yè)添加鏈接和行為17.1 17.1 制作網(wǎng)頁(yè)頁(yè)面制作網(wǎng)頁(yè)頁(yè)面 首先介紹網(wǎng)頁(yè)頁(yè)面的制作方法。首先介紹網(wǎng)頁(yè)頁(yè)面的制作方法。(1) (1) 打開(kāi)打開(kāi)Dreamweaver CCDreamweaver CC軟件，執(zhí)行【文件】軟件，執(zhí)行【文件】| |【新建】命令，打開(kāi)【新建文檔】窗【新建】命令，打開(kāi)【新建文檔】窗口。在【新建文檔】窗口中，選擇【空白頁(yè)】，將【頁(yè)面類(lèi)型】選擇為【口。在【新建文檔】窗口

3、中，選擇【空白頁(yè)】，將【頁(yè)面類(lèi)型】選擇為【HTMLHTML】，】，【布局】選擇為【無(wú)】，如圖【布局】選擇為【無(wú)】，如圖17.217.2所示。所示。(2) (2) 單擊【創(chuàng)建】按鈕即可創(chuàng)建一個(gè)單擊【創(chuàng)建】按鈕即可創(chuàng)建一個(gè)HTMLHTML空白網(wǎng)頁(yè)，如圖空白網(wǎng)頁(yè)，如圖17.317.3所示。所示。 圖圖17.3 17.3 創(chuàng)建一個(gè)創(chuàng)建一個(gè)HTMLHTML空白網(wǎng)頁(yè)空白網(wǎng)頁(yè)圖圖17.2 17.2 【新建文檔】窗口【新建文檔】窗口17.1 17.1 制作網(wǎng)頁(yè)頁(yè)面制作網(wǎng)頁(yè)頁(yè)面(3) (3) 在菜單欄中選擇【插入】在菜單欄中選擇【插入】| |【表格】命令，如圖【表格】命令，如圖17.417.4所示。所示。(4)

4、 (4) 在彈出的【表格】對(duì)話框中，將【行數(shù)】設(shè)置為在彈出的【表格】對(duì)話框中，將【行數(shù)】設(shè)置為3 3，【列】設(shè)置為，【列】設(shè)置為1 1，【表格】，【表格】寬度設(shè)置為寬度設(shè)置為10001000像素，【單元格間距】設(shè)置為像素，【單元格間距】設(shè)置為3 3，【標(biāo)題】設(shè)置為無(wú)，如圖，【標(biāo)題】設(shè)置為無(wú)，如圖17.517.5所示。所示。圖圖17.5 17.5 【表格】對(duì)話框【表格】對(duì)話框圖圖17.4 17.4 選擇【表格】命令選擇【表格】命令17.1 17.1 制作網(wǎng)頁(yè)頁(yè)面制作網(wǎng)頁(yè)頁(yè)面(5) (5) 單擊【確定】按鈕，網(wǎng)頁(yè)中將創(chuàng)建一個(gè)單擊【確定】按鈕，網(wǎng)頁(yè)中將創(chuàng)建一個(gè)3 3行行1 1列的表格，如圖列的表格，

5、如圖17.617.6所示。所示。(6) (6) 將鼠標(biāo)光標(biāo)插入到第將鼠標(biāo)光標(biāo)插入到第1 1行單元格中，鼠標(biāo)右鍵單擊，在彈出的快捷菜單中，選擇行單元格中，鼠標(biāo)右鍵單擊，在彈出的快捷菜單中，選擇【表格】【表格】| |【拆分單元格】命令，如圖【拆分單元格】命令，如圖17.717.7所示。所示。 圖圖17.7 17.7 選擇【拆分單元格】命令選擇【拆分單元格】命令圖圖17.6 17.6 創(chuàng)建表格創(chuàng)建表格17.1 17.1 制作網(wǎng)頁(yè)頁(yè)面制作網(wǎng)頁(yè)頁(yè)面(7) (7) 在彈出的【拆分單元格】對(duì)話框中，將【把單元格拆分】設(shè)置為行，【行數(shù)】在彈出的【拆分單元格】對(duì)話框中，將【把單元格拆分】設(shè)置為行，【行數(shù)】設(shè)置為

6、設(shè)置為2 2，如圖，如圖17.817.8所示。所示。(8) (8) 單擊【確定】按鈕，第單擊【確定】按鈕，第1 1行表格將拆分成兩行，如圖行表格將拆分成兩行，如圖17.917.9所示。所示。圖圖17.9 17.9 拆分單元格拆分單元格圖圖17.8 17.8 【拆分單元格】對(duì)話框【拆分單元格】對(duì)話框17.1 17.1 制作網(wǎng)頁(yè)頁(yè)面制作網(wǎng)頁(yè)頁(yè)面(9) (9) 將鼠標(biāo)光標(biāo)插入到第將鼠標(biāo)光標(biāo)插入到第1 1行單元格中，在菜單欄中選擇【插入】行單元格中，在菜單欄中選擇【插入】| |【圖像】【圖像】| |【圖像】【圖像】命令，如圖命令，如圖17.1017.10所示。所示。(10) (10) 選擇隨書(shū)附帶光盤(pán)

7、中的選擇隨書(shū)附帶光盤(pán)中的CDROMCDROM素材素材Cha17 001.jpgCha17 001.jpg圖片，如圖圖片，如圖17.1117.11所示。所示。圖圖17.11 17.11 選擇圖片選擇圖片圖圖17.10 17.10 選擇【圖像】命令選擇【圖像】命令17.1 17.1 制作網(wǎng)頁(yè)頁(yè)面制作網(wǎng)頁(yè)頁(yè)面(11) (11) 單擊【確定】按鈕，在【屬性】面板中，將【寬】設(shè)置為單擊【確定】按鈕，在【屬性】面板中，將【寬】設(shè)置為10001000，然后單擊【切，然后單擊【切換尺寸約束】換尺寸約束】 按鈕，調(diào)整圖片的寬度，如圖按鈕，調(diào)整圖片的寬度，如圖17.1217.12所示。所示。(12) (12) 將

8、鼠標(biāo)光標(biāo)插入到第將鼠標(biāo)光標(biāo)插入到第2 2行單元格中，在菜單欄中選擇【插入】行單元格中，在菜單欄中選擇【插入】| |【圖像】【圖像】| |【圖【圖像】命令，選擇隨書(shū)附帶光盤(pán)中的像】命令，選擇隨書(shū)附帶光盤(pán)中的CDROMCDROM素材素材Cha17Cha17導(dǎo)航欄導(dǎo)航欄.jpg.jpg圖片，如圖圖片，如圖17.1317.13所示。所示。 圖圖17.13 17.13 選擇圖片選擇圖片圖圖17.12 17.12 調(diào)整圖片的寬度調(diào)整圖片的寬度17.1 17.1 制作網(wǎng)頁(yè)頁(yè)面制作網(wǎng)頁(yè)頁(yè)面(13) (13) 單擊【確定】按鈕，在【屬性】面板中，將【寬】設(shè)置為單擊【確定】按鈕，在【屬性】面板中，將【寬】設(shè)置為1

9、0001000，調(diào)整圖片的寬，調(diào)整圖片的寬度，如圖度，如圖17.1417.14所示。所示。(14) (14) 將鼠標(biāo)光標(biāo)插入到第將鼠標(biāo)光標(biāo)插入到第3 3行單元格中，在菜單欄中選擇【插入】行單元格中，在菜單欄中選擇【插入】| |【表格】命令?！颈砀瘛棵?。在彈出的【表格】對(duì)話框中，將【行數(shù)】設(shè)置為在彈出的【表格】對(duì)話框中，將【行數(shù)】設(shè)置為4 4，【列】設(shè)置為，【列】設(shè)置為1 1，【表格】寬，【表格】寬度設(shè)置為度設(shè)置為10001000像素，【單元格間距】設(shè)置為像素，【單元格間距】設(shè)置為3 3，【標(biāo)題】設(shè)置為無(wú)，如圖，【標(biāo)題】設(shè)置為無(wú)，如圖17.1517.15所所示。示。圖圖17.15 17.15

10、【表格】對(duì)話框【表格】對(duì)話框圖圖17.14 17.14 調(diào)整圖片的寬度調(diào)整圖片的寬度17.1 17.1 制作網(wǎng)頁(yè)頁(yè)面制作網(wǎng)頁(yè)頁(yè)面(15) (15) 單擊【確定】按鈕，插入單擊【確定】按鈕，插入4 4行行1 1列的表格，如圖列的表格，如圖17.1617.16所示。所示。(16) (16) 將鼠標(biāo)光標(biāo)插入到第將鼠標(biāo)光標(biāo)插入到第3 3行單元格中，然后單擊【屬性】面板中的【拆分單元格行單元格中，然后單擊【屬性】面板中的【拆分單元格為行或列】為行或列】 按鈕，拆分單元格，如圖按鈕，拆分單元格，如圖17.1717.17所示。所示。 圖圖17.17 17.17 拆分單元格拆分單元格圖圖17.16 17.16

11、 插入表格插入表格17.1 17.1 制作網(wǎng)頁(yè)頁(yè)面制作網(wǎng)頁(yè)頁(yè)面(17) (17) 在彈出的【拆分單元格】對(duì)話框中，將【把單元格拆分】設(shè)置為行，【行數(shù)】在彈出的【拆分單元格】對(duì)話框中，將【把單元格拆分】設(shè)置為行，【行數(shù)】設(shè)置為設(shè)置為2 2，單擊【確定】按鈕，表格將拆分成兩行，如圖，單擊【確定】按鈕，表格將拆分成兩行，如圖17.1817.18所示。所示。(18) (18) 將鼠標(biāo)光標(biāo)插入到第將鼠標(biāo)光標(biāo)插入到第3 3行單元格中，在菜單欄中選擇【插入】行單元格中，在菜單欄中選擇【插入】| |【圖像】【圖像】| |【圖【圖像】命令，選擇隨書(shū)附帶光盤(pán)中的像】命令，選擇隨書(shū)附帶光盤(pán)中的CDROMCDROM素

12、材素材Cha17A01.jpgCha17A01.jpg圖片，如圖圖片，如圖17.1317.13所示所示圖圖17.19 17.19 選擇圖片選擇圖片圖圖17.18 17.18 表格將拆分成兩行表格將拆分成兩行17.1 17.1 制作網(wǎng)頁(yè)頁(yè)面制作網(wǎng)頁(yè)頁(yè)面(19) (19) 單擊【確定】按鈕，在【屬性】面板中，將【寬】設(shè)置為單擊【確定】按鈕，在【屬性】面板中，將【寬】設(shè)置為135135，如圖，如圖17.2017.20所示。所示。(20) (20) 將鼠標(biāo)光標(biāo)插入到下一行表格，在菜單欄中選擇【插入】將鼠標(biāo)光標(biāo)插入到下一行表格，在菜單欄中選擇【插入】| |【DivDiv】命令，如圖】命令，如圖17.21

13、17.21所示。所示。圖圖17.21 17.21 選擇【選擇【DivDiv】命令】命令圖圖17.20 17.20 設(shè)置【寬設(shè)置【寬】17.1 17.1 制作網(wǎng)頁(yè)頁(yè)面制作網(wǎng)頁(yè)頁(yè)面(21) (21) 在彈出的【插入在彈出的【插入DivDiv】對(duì)話框中，將【】對(duì)話框中，將【IDID】設(shè)置為】設(shè)置為D1D1，如圖，如圖17.2217.22所示。所示。(22) (22) 單擊【確定】按鈕，插入單擊【確定】按鈕，插入DivDiv，如圖，如圖17.2317.23所示。所示。圖圖17.23 17.23 插入插入DivDiv圖圖17.22 17.22 【插入【插入DivDiv】對(duì)話框】對(duì)話框17.1 17.1

14、制作網(wǎng)頁(yè)頁(yè)面制作網(wǎng)頁(yè)頁(yè)面(23) (23) 將將DivDiv中的文字刪除，然后選擇【插入】中的文字刪除，然后選擇【插入】| |【表格】命令，在彈出的【表格】對(duì)【表格】命令，在彈出的【表格】對(duì)話框中，將【行數(shù)】設(shè)置為話框中，將【行數(shù)】設(shè)置為2 2，【列】設(shè)置為，【列】設(shè)置為5 5，【表格】寬度設(shè)置為，【表格】寬度設(shè)置為10001000像素，像素，【單元格間距】設(shè)置為【單元格間距】設(shè)置為0 0，【標(biāo)題】設(shè)置為無(wú)，如圖，【標(biāo)題】設(shè)置為無(wú)，如圖17.2417.24所示。所示。(24) (24) 單擊【確定】按鈕，在單擊【確定】按鈕，在DivDiv中插入中插入2 2行行5 5列的表格，如圖列的表格，如圖

15、17.2517.25所示。所示。 圖圖17.25 17.25 插入表格插入表格圖圖17.24 17.24 【表格】對(duì)話框【表格】對(duì)話框17.1 17.1 制作網(wǎng)頁(yè)頁(yè)面制作網(wǎng)頁(yè)頁(yè)面(25) (25) 將鼠標(biāo)光標(biāo)插入到將鼠標(biāo)光標(biāo)插入到DivDiv的第的第1 1行第行第1 1列表格中，在菜單欄中選擇【插入】列表格中，在菜單欄中選擇【插入】| |【圖像】【圖像】| |【圖像】命令，選擇隨書(shū)附帶光盤(pán)中的【圖像】命令，選擇隨書(shū)附帶光盤(pán)中的CDROMCDROM素材素材Cha17Cha17餐桌椅餐桌椅01.jpg01.jpg圖片，圖片，如圖如圖17.2617.26所示。所示。(26) (26) 單擊【確定】按

16、鈕，然后在【屬性】面板中，將【寬】設(shè)置為單擊【確定】按鈕，然后在【屬性】面板中，將【寬】設(shè)置為200200，如圖，如圖17.2717.27所示。所示。 圖圖17.27 17.27 設(shè)置【寬設(shè)置【寬】圖圖17.26 17.26 選擇圖片選擇圖片17.1 17.1 制作網(wǎng)頁(yè)頁(yè)面制作網(wǎng)頁(yè)頁(yè)面(27) (27) 調(diào)整調(diào)整DivDiv表格中的列寬，將其與圖片對(duì)齊，如圖表格中的列寬，將其與圖片對(duì)齊，如圖17.2817.28所示。所示。(28) (28) 在在DivDiv表格中的第表格中的第2 2行第行第1 1列中，輸入文本列中，輸入文本“餐桌椅餐桌椅”，然后將其居中，如圖，然后將其居中，如圖17.2917

17、.29所示。所示。 圖圖17.29 17.29 輸入文本輸入文本圖圖17.28 17.28 調(diào)整列寬調(diào)整列寬17.1 17.1 制作網(wǎng)頁(yè)頁(yè)面制作網(wǎng)頁(yè)頁(yè)面(29) (29) 使用相同的方法，在使用相同的方法，在DivDiv表格中插入其它圖片并輸入相應(yīng)的文本，完成后的效表格中插入其它圖片并輸入相應(yīng)的文本，完成后的效果如圖果如圖17.3017.30所示。所示。(30) (30) 將鼠標(biāo)插入到下一行空白表格中，將其拆分成兩行，如圖將鼠標(biāo)插入到下一行空白表格中，將其拆分成兩行，如圖17.3117.31所示。所示。 圖圖17.31 17.31 拆分表格拆分表格圖圖17.30 17.30 插入其它圖片并輸入

18、相應(yīng)的文本插入其它圖片并輸入相應(yīng)的文本17.1 17.1 制作網(wǎng)頁(yè)頁(yè)面制作網(wǎng)頁(yè)頁(yè)面(31) (31) 將鼠標(biāo)插入到拆分的第將鼠標(biāo)插入到拆分的第1 1行表格中，在菜單欄中選擇【插入】行表格中，在菜單欄中選擇【插入】| |【圖像】【圖像】| |【圖【圖像】命令，選擇隨書(shū)附帶光盤(pán)中的像】命令，選擇隨書(shū)附帶光盤(pán)中的CDROMCDROM素材素材Cha17A02.jpgCha17A02.jpg圖片，如圖圖片，如圖17.3217.32所示所示(32) (32) 單擊【確定】按鈕，在【屬性】面板中將【寬】設(shè)置為單擊【確定】按鈕，在【屬性】面板中將【寬】設(shè)置為135135，如圖，如圖17.3317.33所示。所

19、示。圖圖17.33 17.33 設(shè)置【寬設(shè)置【寬】圖圖17.32 17.32 選擇圖片選擇圖片17.1 17.1 制作網(wǎng)頁(yè)頁(yè)面制作網(wǎng)頁(yè)頁(yè)面(33) (33) 將鼠標(biāo)光標(biāo)插入到下一行單元格中，在菜單欄中選擇【插入】將鼠標(biāo)光標(biāo)插入到下一行單元格中，在菜單欄中選擇【插入】| |【DivDiv】命令，】命令，在彈出的【插入在彈出的【插入DivDiv】對(duì)話框中，將【】對(duì)話框中，將【IDID】設(shè)置為】設(shè)置為D2D2，如圖，如圖17.3417.34所示。所示。(34) (34) 單擊【確定】按鈕，插入單擊【確定】按鈕，插入DivDiv，如圖，如圖17.3517.35所示所示圖圖17.35 17.35 插入插

20、入DivDiv圖圖17.34 17.34 【插入【插入DivDiv】對(duì)話框】對(duì)話框17.1 17.1 制作網(wǎng)頁(yè)頁(yè)面制作網(wǎng)頁(yè)頁(yè)面(35) (35) 將將DivDiv中的文字刪除，然后然后選擇【插入】中的文字刪除，然后然后選擇【插入】| |【表格】命令，在彈出的【表格】【表格】命令，在彈出的【表格】對(duì)話框中，將【行數(shù)】設(shè)置為對(duì)話框中，將【行數(shù)】設(shè)置為3 3，【列】設(shè)置為，【列】設(shè)置為3 3，如圖，如圖17.3617.36所示所示(36) (36) 單擊【確定】按鈕，在單擊【確定】按鈕，在DivDiv中插入中插入3 3行行3 3列的表格，如圖列的表格，如圖17.3717.37所示所示圖圖17.37

21、17.37 插入表格插入表格圖圖17.36 17.36 【表格】對(duì)話框【表格】對(duì)話框17.1 17.1 制作網(wǎng)頁(yè)頁(yè)面制作網(wǎng)頁(yè)頁(yè)面(37) (37) 將鼠標(biāo)光標(biāo)插入到進(jìn)插入的第將鼠標(biāo)光標(biāo)插入到進(jìn)插入的第1 1行第行第1 1列表格中，在菜單欄中選擇【插入】列表格中，在菜單欄中選擇【插入】| |【圖像】【圖像】| |【圖像】命令，選擇隨書(shū)附帶光盤(pán)中的【圖像】命令，選擇隨書(shū)附帶光盤(pán)中的CDROMCDROM素材素材Cha171.jpgCha171.jpg圖片，圖片，如圖如圖17.3817.38所示。所示。(38) (38) 單擊【確定】按鈕，在【屬性】面板中，將【高】設(shè)置為單擊【確定】按鈕，在【屬性】面

22、板中，將【高】設(shè)置為250250，如圖，如圖17.3917.39所示。所示。圖圖17.39 17.39 設(shè)置【高設(shè)置【高】圖圖17.38 17.38 選擇圖片選擇圖片17.1 17.1 制作網(wǎng)頁(yè)頁(yè)面制作網(wǎng)頁(yè)頁(yè)面(39) (39) 將光標(biāo)定位在第將光標(biāo)定位在第1 1行第行第1 1列單元格中，在【屬性】面板中，將【寬度】設(shè)置為列單元格中，在【屬性】面板中，將【寬度】設(shè)置為333333，然后單擊【居中對(duì)齊】，然后單擊【居中對(duì)齊】 按鈕，如圖按鈕，如圖17.4017.40所示。所示。(40) (40) 使用相同的方法將其它圖片插入到表格中，其中，第使用相同的方法將其它圖片插入到表格中，其中，第2 2、

23、3 3行圖片的高設(shè)置行圖片的高設(shè)置225225，完成后的效果如圖完成后的效果如圖17.4117.41所示。所示。 圖圖17.41 17.41 插入圖片插入圖片圖圖17.40 17.40 【屬性】面板【屬性】面板17.1 17.1 制作網(wǎng)頁(yè)頁(yè)面制作網(wǎng)頁(yè)頁(yè)面(41) (41) 將鼠標(biāo)光標(biāo)插入到下一行表格中，將其拆分為兩行，如圖將鼠標(biāo)光標(biāo)插入到下一行表格中，將其拆分為兩行，如圖17.4217.42所示。所示。(42) (42) 將鼠標(biāo)光標(biāo)插入到拆分后的第將鼠標(biāo)光標(biāo)插入到拆分后的第1 1行表格中，在菜單欄中選擇【插入】行表格中，在菜單欄中選擇【插入】| |【圖像】【圖像】| |【圖像】命令，選擇隨書(shū)附

24、帶光盤(pán)中的【圖像】命令，選擇隨書(shū)附帶光盤(pán)中的CDROMCDROM素材素材Cha17A03.jpgCha17A03.jpg圖片，如圖圖片，如圖17.4317.43所示。所示。圖圖17.43 17.43 選擇圖片選擇圖片圖圖17.42 17.42 拆分表格拆分表格17.1 17.1 制作網(wǎng)頁(yè)頁(yè)面制作網(wǎng)頁(yè)頁(yè)面(43) (43) 單擊【確定】按鈕，在【屬性】面板中將【寬】設(shè)置為單擊【確定】按鈕，在【屬性】面板中將【寬】設(shè)置為135135，如圖，如圖17.4417.44所示。所示。(44) (44) 將鼠標(biāo)光標(biāo)插入到下一行表格中，在菜單欄中選擇【插入】將鼠標(biāo)光標(biāo)插入到下一行表格中，在菜單欄中選擇【插入】

25、| |【DivDiv】命令，在】命令，在彈出的【插入彈出的【插入DivDiv】對(duì)話框中，將【】對(duì)話框中，將【IDID】設(shè)置為】設(shè)置為D3D3，如圖，如圖17.4517.45所示所示 圖圖17.45 17.45 【插入【插入DivDiv】對(duì)話框】對(duì)話框圖圖17.44 17.44 設(shè)置【寬設(shè)置【寬】17.1 17.1 制作網(wǎng)頁(yè)頁(yè)面制作網(wǎng)頁(yè)頁(yè)面(45) (45) 打開(kāi)隨書(shū)附帶光盤(pán)中的打開(kāi)隨書(shū)附帶光盤(pán)中的CDROMCDROM素材素材Cha17Cha17售后服務(wù)條例售后服務(wù)條例.doc.doc文檔，將其文本文檔，將其文本復(fù)制到新插入的復(fù)制到新插入的DivDiv中，如圖中，如圖17.4617.46所示。所

26、示。(46) (46) 將鼠標(biāo)光標(biāo)插入到下一行表格中將其拆分成將鼠標(biāo)光標(biāo)插入到下一行表格中將其拆分成2 2行行2 2列的表格，如圖列的表格，如圖17.4717.47所示。所示。 圖圖17.47 17.47 拆分表格拆分表格圖圖17.46 17.46 復(fù)制文本復(fù)制文本17.1 17.1 制作網(wǎng)頁(yè)頁(yè)面制作網(wǎng)頁(yè)頁(yè)面(47) (47) 參照前面的操作步驟，在第一行表格中分別插入隨書(shū)附帶光盤(pán)中的參照前面的操作步驟，在第一行表格中分別插入隨書(shū)附帶光盤(pán)中的CDROMCDROM素材素材Cha17A04.jpgCha17A04.jpg和和A5.jpgA5.jpg圖片，并調(diào)整其寬，如圖圖片，并調(diào)整其寬，如圖17.

27、4817.48所示。所示。(48) (48) 將鼠標(biāo)光標(biāo)插入到下一行表格的第一列中，打開(kāi)隨書(shū)附帶光盤(pán)中的將鼠標(biāo)光標(biāo)插入到下一行表格的第一列中，打開(kāi)隨書(shū)附帶光盤(pán)中的CDROMCDROM素材素材Cha17Cha17聯(lián)系方式聯(lián)系方式.doc.doc文檔，將其文本復(fù)制到新插入的文檔，將其文本復(fù)制到新插入的DivDiv中，如圖中，如圖17.4917.49所示。所示。圖圖17.49 17.49 復(fù)制文本復(fù)制文本圖圖17.48 17.48 插入圖片插入圖片17.1 17.1 制作網(wǎng)頁(yè)頁(yè)面制作網(wǎng)頁(yè)頁(yè)面(49) (49) 將鼠標(biāo)光標(biāo)插入到表格的第將鼠標(biāo)光標(biāo)插入到表格的第2 2列中，在【屬性】面板中，將【垂直】設(shè)

28、置為頂列中，在【屬性】面板中，將【垂直】設(shè)置為頂端，如圖端，如圖17.5017.50所示。所示。(50) (50) 在菜單欄中選擇【插入】在菜單欄中選擇【插入】| |【表單】【表單】| |【表單】命令，在表格中插入表單，如圖【表單】命令，在表格中插入表單，如圖17.5117.51所示。所示。圖圖17.51 17.51 插入表單插入表單圖圖17.50 17.50 【屬性】面板【屬性】面板17.1 17.1 制作網(wǎng)頁(yè)頁(yè)面制作網(wǎng)頁(yè)頁(yè)面(51) (51) 參照前面的操作步驟，在表單中插入?yún)⒄涨懊娴牟僮鞑襟E，在表單中插入5 5行行1 1列的表格，其寬度設(shè)置為列的表格，其寬度設(shè)置為500500，單元，單元

29、格間距為格間距為3 3，如圖，如圖17.5217.52所示所示(52) (52) 在表單中的表格里，分別插入【文本】、【電子郵件】、【在表單中的表格里，分別插入【文本】、【電子郵件】、【TelTel】、【文本區(qū)】、【文本區(qū)域】、【域】、【“提交提交”按鈕】和【按鈕】和【“重置重置”按鈕】，然后對(duì)插入的表單元素的文本進(jìn)按鈕】，然后對(duì)插入的表單元素的文本進(jìn)行修改并將文本區(qū)域的文本行數(shù)設(shè)置為行修改并將文本區(qū)域的文本行數(shù)設(shè)置為5 5，如圖，如圖17.5317.53所示。所示。圖圖17.53 17.53 插入表單元素插入表單元素圖圖17.52 17.52 插入表格插入表格17.1 17.1 制作網(wǎng)頁(yè)頁(yè)面

30、制作網(wǎng)頁(yè)頁(yè)面(53) (53) 將鼠標(biāo)光標(biāo)插入到表格的最后一行中，輸入相應(yīng)的鏈接和版權(quán)文本，并將其居將鼠標(biāo)光標(biāo)插入到表格的最后一行中，輸入相應(yīng)的鏈接和版權(quán)文本，并將其居中對(duì)齊，如圖中對(duì)齊，如圖17.5417.54所示。所示。(54) (54) 在【屬性】面板中，將文字顏色設(shè)置為白色，單元格的背景顏色設(shè)置為黑色，在【屬性】面板中，將文字顏色設(shè)置為白色，單元格的背景顏色設(shè)置為黑色，如圖如圖17.5517.55所示。所示。圖圖17.55 17.55 【屬性】面板【屬性】面板圖圖17.54 17.54 輸入文本輸入文本17.2 17.2 為網(wǎng)頁(yè)添加鏈接和行為為網(wǎng)頁(yè)添加鏈接和行為 網(wǎng)頁(yè)頁(yè)面制作完成后，下面介紹為網(wǎng)頁(yè)添加鏈接和行為的操作步驟。網(wǎng)頁(yè)頁(yè)面制作完成后，下面介紹為網(wǎng)頁(yè)添加鏈接和行為的操作步驟。(1) (1) 選擇導(dǎo)航欄圖片，在【屬性】面板中使用【選擇導(dǎo)航欄圖片，在【屬性】面板中使用【Rectangle Hotspot ToolRectangle Hotspot Tool】 按鈕，按鈕，為導(dǎo)航欄圖片中的導(dǎo)航文字添加矩形熱點(diǎn)，如圖為導(dǎo)航欄圖片中的導(dǎo)航文字添加矩形熱點(diǎn)，如圖17.5617.56所示。