1、第 3 章制作圖文混排網(wǎng)頁(yè) 圖像也是網(wǎng)頁(yè)中的主要元素之一， 圖像不但能美化網(wǎng)頁(yè)，而且能夠更直觀地表達(dá)信息。 在頁(yè)面中恰到好處地使用圖像，能使網(wǎng)頁(yè)更加生動(dòng)、形象和美觀。 【教學(xué)導(dǎo)航】 教學(xué)目標(biāo) （1） 學(xué)會(huì)通過(guò)“管理站點(diǎn)”對(duì)話框創(chuàng)建站點(diǎn) （2） 學(xué)會(huì)應(yīng)用“高級(jí)”方式創(chuàng)建站點(diǎn) （3） 學(xué)會(huì)通過(guò)“文件”面板創(chuàng)建網(wǎng)頁(yè) （4） 掌握設(shè)置頁(yè)面背景圖像的方法 （5） 掌握在網(wǎng)頁(yè)中插入圖像的方法 （6） 掌握在網(wǎng)頁(yè)中插入鼠標(biāo)經(jīng)過(guò)圖像的方法 （7） 掌握設(shè)置圖像屬性的方法 （8） 掌握制作圖文混排網(wǎng)頁(yè)的技巧 本章重點(diǎn) （1） 設(shè)置頁(yè)面背景圖像 （2） 在網(wǎng)頁(yè)中插入圖像 （3） 設(shè)置圖像屬性 本章難點(diǎn) （1） 應(yīng)

2、用“高級(jí)”方式創(chuàng)建站點(diǎn) （2） 插入鼠標(biāo)經(jīng)過(guò)圖像 教學(xué)方法 任務(wù)驅(qū)動(dòng)法、分組討論法、三步訓(xùn)練法 課時(shí)建議 6 課時(shí)（含課堂同步訓(xùn)練） 3.1課前準(zhǔn)備 （1） 在本地硬盤(pán)創(chuàng)建文件夾 （2） 啟動(dòng) Dreamweaver CS3 通過(guò) Windows的【開(kāi)始】菜單啟動(dòng) Dreamweaver CS3。 3.2課堂引導(dǎo)訓(xùn)練及評(píng)價(jià) 【課堂引導(dǎo)訓(xùn)練任務(wù)描述】 1、網(wǎng)頁(yè)制作任務(wù)卡 網(wǎng)頁(yè)制作任務(wù)卡如表 3-1所示。 表 3-1網(wǎng)頁(yè)制作任務(wù)卡Dreamweaver CS3 網(wǎng)頁(yè)制作案例教程 50 任務(wù)編號(hào) 03-1 任務(wù)名稱 制作圖文混排網(wǎng)頁(yè) 網(wǎng)頁(yè)主題 瀑布游 計(jì)劃工時(shí) min 網(wǎng)頁(yè)制作任務(wù)描述 （1） 應(yīng)用

3、【站點(diǎn)定義】對(duì)話框的“高級(jí)”方式創(chuàng)建站點(diǎn)“瀑泉游” （2） 應(yīng)用“文件面板新建網(wǎng)頁(yè)“ index0301.html” （3） 設(shè)置網(wǎng)頁(yè)的背景圖像 （4） 將 Word文檔“瀑布之美.doc”導(dǎo)入到網(wǎng)頁(yè)“ index0301.html ”中 （5） 設(shè)置網(wǎng)頁(yè)中文本的格式 （6） 在網(wǎng)頁(yè)中插入多幅圖像 （7） 在網(wǎng)頁(yè)中插入鼠標(biāo)經(jīng)過(guò)圖像 （8） 設(shè)置圖像屬性 網(wǎng)頁(yè)布局結(jié)構(gòu)分析 頁(yè)面自然布局、無(wú)導(dǎo)航欄 網(wǎng)頁(yè)色彩搭配分析 文本主體顏色：#000000,其他文本顏色： #0000FF、#00FFFF、#FF0000 網(wǎng)頁(yè)組成元素分析 主要包括圖像、鼠標(biāo)經(jīng)過(guò)圖像、標(biāo)題文本、正文文本等網(wǎng)頁(yè)元素 任務(wù)實(shí)現(xiàn)流程分

4、析 創(chuàng)建站點(diǎn)T新建網(wǎng)頁(yè)T設(shè)置頁(yè)面背景圖像T導(dǎo)入 Word文檔T插入圖像、 設(shè)置圖像屬性T插入鼠標(biāo)經(jīng)過(guò)圖像且設(shè)置其屬性T預(yù)覽網(wǎng)頁(yè)效果 配盤(pán)素材導(dǎo)引 原始文件位置：start03第 3章制作圖文混排網(wǎng)頁(yè)task03-1 最終文件位置：result03 第 3章制作圖文混排網(wǎng)頁(yè)task03-1 2、網(wǎng)頁(yè)制作任務(wù)跟蹤卡 網(wǎng)頁(yè)制作任務(wù)跟蹤卡如表 3-2所示。 表 3-2網(wǎng)頁(yè)制作任務(wù)跟蹤卡 任務(wù)編號(hào) 開(kāi)始時(shí)間 完成時(shí)間 計(jì)劃工時(shí) 實(shí)際工時(shí) 當(dāng)前狀態(tài) 【網(wǎng)頁(yè)效果展示】 網(wǎng)頁(yè)index0301.html的瀏覽效果如圖 3-1所示。 【任務(wù)完成過(guò)程】 3.2.1 應(yīng)用“高級(jí)”方式創(chuàng)建站點(diǎn)“瀑泉游” 【操作要求】

5、 應(yīng)用【站點(diǎn)定義】對(duì)話框的“高級(jí)”方式創(chuàng)建站點(diǎn)“瀑泉游”第 3章制作圖文混排網(wǎng)頁(yè) 51 澤布工芙 山之奘，奘在券斤竟洪，暫差林立.矣在云卿I騎，JtTW. 燉!6美在眨吃萬(wàn)千席他很濮，EaW.或液珀灤躋.m-LTK相碗 .近現(xiàn)也轉(zhuǎn)幣馬奔&. 。掛iff三百丈聽(tīng)超皴卜里” I滋新理靳H滋匱輕劭 m；*.H：X . U須卡航而T e；is-ltflr is時(shí)M飛硼幣釆近譽(yù)軒;S.很臣或刖霞風(fēng)咗沖戶聲，酥耳*，S5LWPJB#H豐廊不禺. P仝各之叵由，真址五盲二律，壺鳳和塢.正定飛門匚那謎咱色境石樂(lè)童怕柚，至園石至tflifl吝+猶國(guó)也K遼闈“地畑憂爭(zhēng)變，河濟(jì)矗備“ ?W?7t的 審帀“甸

6、務(wù)樣加 E 的讓人t謹(jǐn)神往. 西果呵海方辭圧干賢州出霽中丘原樋寧.夭於方耐市威曰荷縣環(huán)內(nèi)，臣壬陽(yáng)市釣1旳余公里、誑由折環(huán)図前各只印丈I鍛右 SS庶，耳中以請(qǐng)?zhí)沽P丸逼擊品為忙矣壯視”曲的對(duì)（果擁鵰布群 財(cái)很吊耘曲召?gòu)B右不僅岡的昔且恃円55型十知f.如増和世脛|母田卑跆幻犧悩?biāo)蚜柢垒S而目在茸IS駆切鏘歡 ffiNffifi.湘內(nèi)定育酗喀斷仔涼亢迪;it用亦誥芒旳爲(wèi)州JUT世算，具有（0K的談甜觀光於H，故國(guó)務(wù)蛋已!tt準(zhǔn)礙苗果技誕右毎列迪全 國(guó)至一伍點(diǎn)鳳耀肚開(kāi)茨區(qū)域. 百丈議位于itu的署產(chǎn)翩幸云峰丈間.潔科尺舉鬲爭(zhēng);而下，sS-pcSsiasfiKi. 百丈爲(wèi)在七Kfti卜雨時(shí)最性礙枯水舉節(jié)，

7、百丈Aw沆渦律 虹軽如猷鴉幔2遨, *洪水季節(jié).尤旦是大幣機(jī)貓型収輅飛瀑畋離巖壁，好需無(wú)故卡活匸印昔花空中是動(dòng), 耳再句詩(shī)=U01亟屋百丈舉，畀蔵山一25穌.“將百丈jlfflbt奘戮i空罔電IS圮1出未. 廬山的三査泉博布 FLU*+fr主更編血耳：三替眾廉弔.開(kāi)先i市、：EJ君津乩亓如和茁iSit吒 王瓦軟跟;!和玉簾呆蠱掃不 三砂禹布之水.自丸目詭匕粥耀一踐1&：S13五吵細(xì)由土豐懸衽于光盤(pán)石之上，又飛瀉到第二展光盤(pán)石，西飾料 乩屢又氏蟻閩梟二/!秋盤(pán)右上，孫成三蚩故潯咅二登夷潦布* LL t駅撇U中曾遼羊咼h_釀扛。上議燉啊匸應(yīng)綁，=塊址 囲石4.=紙如玉血洋.“廬1_|第一在

8、現(xiàn)羊耳“布到三!ST”下恵廬1_|百之說(shuō). feffSfSiga，tptSC玉曲三去誤溫弔，擁白鑿薛飛iiUliffi,更如燃秋矚，弭想繪空萬(wàn)剛陽(yáng)琮，九天拋香- 圖 3-1圖文混排網(wǎng)頁(yè)的瀏覽效果 【實(shí)施過(guò)程】 （1 ）打開(kāi)【管理站點(diǎn)】對(duì)話框 （2） 打開(kāi)【站點(diǎn)定義】對(duì)話框 （3） 設(shè)置站點(diǎn)的“本地信息” 在“分類”列表中單擊選擇“本地信息”選項(xiàng)，輸入或選擇以下各項(xiàng)： 在“站點(diǎn)名稱”文本框中輸入所創(chuàng)建站點(diǎn)的名稱“瀑泉游” 在“本地根文件夾”文本框中輸入根文件夾“ D:E游天下03第3章制作圖文混排 網(wǎng)頁(yè)”。 在“默認(rèn)圖像文件夾”文本框中輸入“ D:E游天下03第3章制作圖文混排網(wǎng)頁(yè) ”。也可以打

9、開(kāi)對(duì)話框選擇一個(gè)文件夾。 輸入本機(jī)的 HTTP 地址，如 http:/172.167.26/Etour/。 （4） 設(shè)置站點(diǎn)的“遠(yuǎn)程信息” 在【管理站點(diǎn)】對(duì)話框中單擊【完成】按鈕，新建站點(diǎn)便完成。 3.2.2 應(yīng)用“文件”面板新建網(wǎng)頁(yè)“ in dex0301.html” 【操作要求】 應(yīng)用“文件”面板在站點(diǎn)“瀑泉游”中新建一個(gè)網(wǎng)頁(yè)文檔“ in dex0301.html”。 黃山的百丈博 吐剤廿勒 杭吳舌亢如泉上為盧育水樂(lè)下為百丈 側(cè)多思晉嚴(yán)戲Kit亠星代畫(huà)靈丑士抹 Dreamweaver CS3 網(wǎng)頁(yè)制作案例教程 52 【實(shí)施過(guò)程】 （1） 打開(kāi)“文件”面板 如果“文件”面板處理隱藏狀態(tài)，則單

10、擊菜單【窗口】T【文件】打開(kāi)“文件”面板。 （2） 新建網(wǎng)頁(yè)文檔 在“文件”面板中站點(diǎn)“瀑泉游”的文件夾 單中單擊【新建文件】菜單項(xiàng)，如圖3-7所示。然后輸入新的網(wǎng)頁(yè)文檔名稱 “index0301.html”, 按回車鍵確認(rèn)。 3.2.3 設(shè)置頁(yè)面的背景圖像 【操作要求】 設(shè)置網(wǎng)頁(yè)“ index0301.html ”的背景圖像為“ bgO1.gif ”。 【實(shí)施過(guò)程】 （1 ）打開(kāi)新建的網(wǎng)頁(yè)文檔“ in dex0301.html” （2）設(shè)置網(wǎng)頁(yè)的背景圖像 3.2.4 從外部導(dǎo)入文本與設(shè)置文本格式 【操作要求】 （1 ）將Word文檔“瀑布之美.doc”導(dǎo)入到網(wǎng)頁(yè)“ index0301.htm

11、l ”中。 （2） 將網(wǎng)頁(yè)“ index0301.html ”的標(biāo)題設(shè)置為“瀑布之美”。 （3） 將網(wǎng)頁(yè)“ index0301.html ”中的文本標(biāo)題“瀑布之美”字體設(shè)置為“黑體” ，大小 設(shè)置為“ 18像素”，顏色為“ #OOOOFF”，對(duì)齊方式設(shè)置為“居中對(duì)齊”。 （4） 將網(wǎng)頁(yè)“ index0301.html ”中的文本“推薦度：”字體設(shè)置為“仿宋 _GB2312 ”， 大小設(shè)置為“16像素”，顏色為“ #OOFFFF”，對(duì)齊方式設(shè)置為“居中對(duì)齊”。 （5） 將網(wǎng)頁(yè)“ index0301.html ”中的文本“”字體設(shè)置為“楷體 _GB2312 ”， 大小設(shè)置為“14像素”，顏色為“

12、#FFOOOO”，對(duì)齊方式設(shè)置為“居中對(duì)齊”。 （6） 將網(wǎng)頁(yè)“ index0301.html ”中正文文本的字體設(shè)置為“宋體” ， 大小設(shè)置為“ 14 像素”。 （7） 將網(wǎng)頁(yè)“in dex0301.html ”中的小標(biāo)題“黃果樹(shù)瀑布群”、“黃山的百丈瀑”和“廬 山的三疊泉瀑布”大小設(shè)置為“ 16像素”，且設(shè)置為“粗體”。 （8） 將網(wǎng)頁(yè)“ index0301.html ”中的小標(biāo)題“黃山的百丈瀑”對(duì)齊方式設(shè)置為“右對(duì) 齊”，其他兩個(gè)小標(biāo)題的對(duì)齊方式設(shè)置為“左對(duì)齊” 。 【實(shí)施過(guò)程】 （1）準(zhǔn)備Word文檔 （2 ）打開(kāi)導(dǎo)入對(duì)話框 （3 ）導(dǎo)入文本 （4） 設(shè)置網(wǎng)頁(yè)“ index0301.h

13、tml ”的文本格式 （5） 設(shè)置網(wǎng)頁(yè)標(biāo)題 （6 ）保存網(wǎng)頁(yè) （7）預(yù)覽網(wǎng)頁(yè)效果 按F12預(yù)覽網(wǎng)頁(yè)的效果如圖 3-13所示。 task03-1”上單擊右鍵，在彈出的快捷菜 第 3章制作圖文混排網(wǎng)頁(yè) 53 圖 3-13 網(wǎng)頁(yè)“ index0301.html ”的預(yù)覽效果 325 插入圖像 【操作要求】 （1） 在網(wǎng)頁(yè)“ index0301.html ”中插入圖像p01.jpg，且設(shè)置其屬性：寬為 120,高為 80,垂直邊距為15,水平邊距為10,替換文本為“黃果樹(shù)瀑布群”，對(duì)齊方式為“左對(duì)齊”。 （2） 在網(wǎng)頁(yè)“ index0301.html ”中插入圖像“ p02.jpg ”，且設(shè)置其屬性：

14、寬為 120，高 為100，垂直邊距為10,水平邊距為5，替換文本為“黃山的百丈瀑”，對(duì)齊方式為“右對(duì) 齊”。 （3） 在網(wǎng)頁(yè)“ index0301.html ”中插入圖像“ p03.jpg ”，且設(shè)置其屬性：寬為 120,高 為100，垂直邊距為15,水平邊距為10,替換文本為“廬山的三疊泉瀑布” ，對(duì)齊方式為 “左對(duì)齊”。 【實(shí)施過(guò)程】 （1 ）插入第一幅圖像 （2 ）設(shè)置第一幅圖像的屬性 （3 ）插入第二幅圖像 （4 ）設(shè)置第二幅圖像的屬性 （5 ）插入第三幅圖像 （6 ）設(shè)置第三幅圖像的屬性 （7）保存網(wǎng)頁(yè)中插入的圖像和設(shè)置的圖像屬性 3.2.6 插入鼠標(biāo)經(jīng)過(guò)圖像 【操作要求】 （1）

15、在網(wǎng)頁(yè)“ index0301.html”中插入鼠標(biāo)經(jīng)過(guò)圖像，原始圖像為“ c01.jpg ”，鼠標(biāo)經(jīng) 過(guò)圖像為c02.jpg ”，替換文本為瀑布之美”。 Dreamweaver CS3 網(wǎng)頁(yè)制作案例教程 54 （2）設(shè)置鼠標(biāo)經(jīng)過(guò)圖像的屬性：寬為 200,高為120,垂直邊距為10,邊框?yàn)?，對(duì) 齊方式為底部”。 【實(shí)施過(guò)程】 （1） 插入鼠標(biāo)經(jīng)過(guò)圖像 （2） 設(shè)置鼠標(biāo)經(jīng)過(guò)圖像的屬性 （3） 保存網(wǎng)頁(yè)中插入的鼠標(biāo)經(jīng)過(guò)圖像及其屬性設(shè)置 3.2.7 瀏覽網(wǎng)頁(yè)效果 按F12瀏覽圖文混排網(wǎng)頁(yè)的效果，如圖 3-所示。 【課堂引導(dǎo)訓(xùn)練任務(wù)完成情況評(píng)價(jià)】 對(duì)本次網(wǎng)頁(yè)制作任務(wù)的完成情況進(jìn)行自評(píng)，網(wǎng)頁(yè)制作任務(wù)完成

16、情況評(píng)價(jià)內(nèi)容如表 3-3 所示。 表 3-3網(wǎng)頁(yè)制作任務(wù)完成情況評(píng)價(jià)表 任務(wù)名稱 制作圖文混排網(wǎng)頁(yè) 綜合評(píng)價(jià) 任務(wù)完成情況分項(xiàng)評(píng)價(jià) 創(chuàng)建站點(diǎn) 網(wǎng)頁(yè)布局 色彩搭配 網(wǎng)頁(yè)內(nèi)容 瀏覽效果 其他 存在的主要問(wèn)題 3.3 課堂同步訓(xùn)練及評(píng)價(jià) 3.3.1 課堂同步訓(xùn)練任務(wù)描述 1、同步訓(xùn)練任務(wù)卡 課堂同步訓(xùn)練的任務(wù)卡如表 3-4所示。 表 3-4課堂同步訓(xùn)練任務(wù)卡 任務(wù)編號(hào) 03-2 任務(wù)名稱 制作介紹中國(guó)名泉的圖文混排網(wǎng)頁(yè) 網(wǎng)頁(yè)主題 中國(guó)名泉 計(jì)劃工時(shí) 30min 同步訓(xùn)練任務(wù)描述 （1 ）創(chuàng)建一個(gè)命名為“中國(guó)名泉”的站點(diǎn)，該站點(diǎn)存儲(chǔ)在本地計(jì)算機(jī)的文件 夾“ task03-2” 中。 （2） 在“文件”

17、面板的站點(diǎn)根目錄下創(chuàng)建文件夾“ images”和“ text”。 （3） 創(chuàng)建一個(gè)網(wǎng)頁(yè)介紹中國(guó)名泉，該網(wǎng)頁(yè)的名稱為“ ex0302.html”，存儲(chǔ)在 第 3章制作圖文混排網(wǎng)頁(yè) 55 文件夾“ task03-2”中。 （4） 將網(wǎng)頁(yè)的背景顏色設(shè)置為 “#ffffff ”， 背景圖像設(shè)置為“bg-blue.gif”， 左、 右邊距設(shè)置為“ 80px ”，上、下邊距設(shè)置為“ 20px ”。 （5） 將網(wǎng)頁(yè)的標(biāo)題設(shè)置為“中國(guó)名泉欣賞” 。 （6 ）在該網(wǎng)頁(yè)中輸入多個(gè)文本標(biāo)題和多段文本。 （7） 將網(wǎng)頁(yè)文本標(biāo)題“中國(guó)名泉”的字體設(shè)置為“宋體”，大小設(shè)置為“24px”， 字形設(shè)置為“粗體”，文本顏色設(shè)置

18、為“ #00FFFF ”，對(duì)齊方式設(shè)置為“居中對(duì) 齊”。 （8） 將標(biāo)題“濟(jì)南趵突泉”、“廬山谷簾泉”和“虎跑泉”的字體設(shè)置為“宋 體”，大小設(shè)置為“ 18px”，字形設(shè)置為“粗體”。 （9） 在網(wǎng)頁(yè)“ ex0302.html”中插入圖像 m01.jpg，且設(shè)置其屬性：寬為 135， 高為 70，垂直邊距為 8,水平邊距為 8，替換文本為“趵突泉”，對(duì)齊方式為 “左對(duì)齊”。 （10） 在網(wǎng)頁(yè)“ ex0302.html ”中插入圖像“ m02.jpg ”，且設(shè)置其屬性：寬為 124,高為 70，垂直邊距為 5,水平邊距為 5，替換文本為“谷簾泉”，對(duì)齊方 式為“右對(duì)齊”。 （11） 在網(wǎng)頁(yè)“ e

19、x0302.html ”中插入圖像“ m03.jpg ”，且設(shè)置其屬性：寬為 120,高為 70，垂直邊距為 10,水平邊距為 10,替換文本為“虎跑泉”，對(duì)齊 方式為“基線”。 （12） 在網(wǎng)頁(yè)“ ex0302.html”中插入鼠標(biāo)經(jīng)過(guò)圖像，原始圖像為“ c01.jpg”， 鼠標(biāo)經(jīng)過(guò)圖像為“ c02.jpg”，替換文本為“中國(guó)名泉”。 （13） 設(shè)置鼠標(biāo)經(jīng)過(guò)圖像的屬性：寬為 110,高為 85，邊框?yàn)?0。 配盤(pán)素材導(dǎo)引 原始文件位置： start03 第 3章制作圖文混排網(wǎng)頁(yè)task03-2 最終文件位置： result03 第3 章制作圖文混排網(wǎng)頁(yè)task03-2 2、同步訓(xùn)練任務(wù)跟蹤卡

20、 課堂同步訓(xùn)練的任務(wù)跟蹤卡如表 3-5所示。 表 3-5課堂同步訓(xùn)練的任務(wù)跟蹤卡 任務(wù)編號(hào) 開(kāi)始時(shí)間 完成時(shí)間 計(jì)劃工時(shí) 實(shí)際工時(shí) 當(dāng)前狀態(tài) 3.3.2 同步訓(xùn)練網(wǎng)頁(yè)的效果展示 同步訓(xùn)練網(wǎng)頁(yè)的瀏覽效果如圖 3-24所示。Dreamweaver CS3 網(wǎng)頁(yè)制作案例教程 56 泉水盡界了人芙0j主肅，更矣it了大矩，繪“瞬門聯(lián)印山川尋西詞泉四季詼 進(jìn)泉和SS冰RL孝圧水泉曲甬而出.飛卑転I嗜水眾潔;fe 如黃 汩汩*卜盂I咄臬您迪而起 出異沁.間Sf眾對(duì)潔時(shí)I*吿怡帶宜b E 口；奇自怪的茨火眾 甘苦泉 駕遜泉等?r這些電黒-均對(duì)用最名肚TJ痕上i韋花史眇，冃滇益矗.芒譎中 E. 濟(jì)南的宜泉 跨

21、蕊泉冊(cè)雨七十二耘昱，蘇確用一5T三早累簾司獵年聞王沖13呱節(jié)， 含瞬咼靚兀尊抹b緒勰越以天F5?的 F卩毀，四扛 聲山瞥疽泉 戸山曲天下弟一眾往壬埠燼陽(yáng)璋*西越王卷中，叫曽簾晶SttS王妥石.幷亶、臂少雷、臺(tái)玉址利E 盛育舷地淵甌堂1J芒帕，并頸下了垢麗的諒軋白玉卿寸伽日卷簾臬竝因勝呆 侑了如F勾旨“章農(nóng)古倨崇/點(diǎn)，鼻說(shuō)洱忑空確.七里一理碩対斷避過(guò)復(fù)兩.步AtL套利亦1.11% 隹斗有遙壇.ntsai節(jié)貯is.吧里云訐夏嚇遽. 庇跑泉 徃于応州丙湖丙雨丈靱.下的険惡，日于處從瑙帝岸閘石羽E貴中i姐京的“耘的可洛聲曠換斬不於.型ti鐮栩陽(yáng)當(dāng)?帶* 逐化搟井祈it明. - 它H5T曲質(zhì)色壬*5升水

22、中曰可還克円1恥鑒卞.Jt-KUAeiK. E任星水和龍井覆水ISifl 筑迪癡噴杲水特S怖人心粘破對(duì)理召杲足氐 BtS閩9國(guó)itl祖亦.泉皿甘.科耳臬奢書(shū)畝。壬下耐寶”五牛先宇”制t肖詩(shī)！f曰.”盍入和曲前木，常石匏尊自在冒、 尤耳吳用主赳朮礙鞄-潔哲1書(shū)乩 皿壬元盯，昨向血tW”.足 種上第価“益為”冋炬”.隔中ft. 圖 3-24同步訓(xùn)練網(wǎng)頁(yè)的瀏覽效果 3.3.3 同步訓(xùn)練網(wǎng)頁(yè)的制作要點(diǎn)提示 （1 ）首先在文件夾“ 03第3章制作圖文混排網(wǎng)頁(yè)”新建一個(gè)子文件夾“ task03-2 ”。 這些操作應(yīng)在Windows操作系統(tǒng)的資源管理器中完成。 （2）利用【站點(diǎn)定義】對(duì)話框創(chuàng)建站點(diǎn)“中國(guó)名泉

23、” ，注意存儲(chǔ)位置為“盤(pán)符 03第 3章制作圖文混排網(wǎng)頁(yè)task03-2 ”。 （3 ）在Dreamweaver CS3的“文件”面板中新建文件夾“ images”和“ text ”，然后將 光盤(pán)中圖像文件拷貝到子文件夾“ images”中，將文本文件“ ex0302.txt”拷貝到子文件夾 “text”中，注意拷貝文件也應(yīng)在 Windows操作系統(tǒng)的資源管理器中完成。 （4）為了節(jié)省輸入文字的時(shí)間，文本網(wǎng)頁(yè)中所需的文字直接從文本文件“ ex0302.txt ” 中拷貝即可。 3.3.4 課堂同步訓(xùn)練評(píng)價(jià) 課堂同步訓(xùn)練評(píng)價(jià)內(nèi)容如表 3-6所示。 表 3-6課堂同步訓(xùn)練評(píng)價(jià)表 任務(wù)編號(hào) 03-2

24、 任務(wù)名稱 制作介紹中國(guó)名泉的圖文混排網(wǎng)頁(yè) 任務(wù)完成方式 【】小組協(xié)作完成 【 個(gè)人獨(dú)立完成 課堂同步實(shí)踐任務(wù)完成情況評(píng)價(jià) 自我評(píng)價(jià) 小組評(píng)價(jià) 教師評(píng)價(jià) 存在的主要問(wèn)題 第 3章制作圖文混排網(wǎng)頁(yè) 57 Dreamweaver CS3 網(wǎng)頁(yè)制作案例教程 58 3.4課外拓展訓(xùn)練 1、拓展訓(xùn)練任務(wù)卡 課外拓展訓(xùn)練的任務(wù)卡如表 3-7所示。 表 3-7課外拓展訓(xùn)練任務(wù)卡 任務(wù)編號(hào) 03-3 任務(wù)名稱 制作介紹中國(guó)名島的圖文混排網(wǎng)頁(yè) 網(wǎng)頁(yè)主題 中國(guó)名島 計(jì)劃工時(shí) 60min 拓展任務(wù)描述 我國(guó)悠久的文化、遼闊的海域，造就了獨(dú)特的海島風(fēng)情。海島觀光不僅可以盡 情地欣賞海景，感受大海寬闊的胸懷、多變的景色、深沉的性格，欣賞海蝕奇 觀、神秘?；稹⒑Ｊ序讟堑让匀说暮Ｉ掀嬗^，還可以欣賞海島獨(dú)特的