一、教學目標

1.能夠為網頁中的文本和圖像設置超鏈接。

2.通過教師演示、自主探究等方法，提高觀察和動手操作的能力。

3.在探究設置超鏈接的過程中，能夠感受到網頁制作的樂趣，提高學習的積極性。

二、教學重難點

【重點】網頁中文本和圖像的超鏈接設置。

【難點】網頁中圖像超鏈接的靈活設置。

三、教學過程

(一)導入新課

教師通過多媒體展示制作完成的“沈陽簡介”網站，讓學生觀察在網站首頁上和之前制作的首頁有哪些區別?學生會發現有些文字下方出現了下劃線，顏色也不同。教師演示鼠標單擊首頁中的帶有下劃線的文字和網頁中的圖片，讓學生觀察出現了什么變化?學生發現頁面跳轉到了另一個頁面。教師繼而引導學生思考：當點擊頁面上的文本或圖片時，怎么跳轉到其他頁面呢?網頁之間的聯系應該如何建立呢?從而引入本節課的學習。

(二)新課講授

1.建立文本超鏈接

教師激發學生思考：如果想要為網頁中的文本設置超鏈接，首先應該做什么?【選中文本】教師表揚學生反應迅速，并進行演示操作，選中文字“地理環境”后，利用“屬性”面板，在“鏈接”右側選擇文件“地理環境.html”，在“目標”下拉列表中選擇“_blank”選項，創建文本鏈接。演示完成后讓學生觀察文字“地理環境”的變化。【文字變成了藍色，文字下方出現下劃線】

教師布置任務：嘗試自己完成文本超鏈接的設置，實現單擊“地理環境”能夠跳轉到“地理環境.html”頁面。學生操作過程中，教師加以巡視，并提示學生：完成后可以通過單擊“在瀏覽器中預覽/調試”按鈕，在瀏覽器中預覽設置的超鏈接效果，查看是否設置成功。學生操作完成后，教師拋出問題：_blank的作用是什么?_blank和_self的區別是什么?教師讓學生嘗試修改目標中的選項，操作完成后指定學生回答。【使用_blank，是在新的窗口中顯示頁面，使用_self，是在當前網頁窗口中顯示頁面，不會打開新的窗口】教師表揚學生操作認真，回答的準確。

教師激發學生思考：有沒有其他的方法可以為文本設置超鏈接?教師布置任務：讓學生閱讀課本，自行探究，為文本“風土人情”設置超鏈接，鏈接到“風土人情.html”頁面。學生操作結束后指定學生說出操作要點。【選中后，在“常用”插入欄中，點擊“超級鏈接”按鈕，在彈出的對話框中，設置鏈接的目標文檔，并在“目標”下拉列表中選擇_blank選項】教師評價學生歸納總結能力強，思路清晰。

2.創建圖像鏈接

教師提問：如果想要為沈陽簡介中的太陽鳥建筑圖片設置超鏈接，是否和文字設置的方法一樣呢?教師布置任務：按照設置文本超鏈接的方法嘗試自主操作，實現單擊圖片后跳轉到“太陽鳥介紹.html”頁面。學生操作過程中教師進行巡視指導，完成后教師根據學生操作情況進行總結：如果是對整個圖像建立鏈接，和文字設置方法一樣。

教師拋出問題：如果想要為圖像的部分區域設置超鏈接，怎樣進行設置?教師組織學生以小組為單位進行討論和操作，將太陽鳥區域設為鏈接區域，鏈接到“太陽鳥介紹.html”頁面。討論后由小組代表演示及講解操作要點。【選中圖像，在屬性面板中找到橢圓形熱點工具，在圖像上拖動，選中太陽鳥區域，并設置鏈接的目標文檔和目標】教師評價學生操作很熟練，并解釋：這屬于熱點鏈接，單擊設置的鏈接區域，從而跳轉到相應頁面。圖像屬性欄中的“替換”中可以寫明圖片的含義，當圖片無法顯示的時候，替換中的文字就會顯示出來。教師讓學生繼續完善對圖像鏈接的設置。

(三)鞏固提高

在學生了解了如何為文字和圖像設置超鏈接后，教師布置任務：學生獨立操作，將首頁中的其他欄目以及圖片設置對應的超鏈接。操作完成后同桌兩人進行相互展示，在瀏覽器中預覽是否能夠實現正確的跳轉。

(四)小結作業

小結：教師提問為文字設置超鏈接的兩種方式。根據學生的回答點評學生對知識掌握得牢固。

作業：思考為網頁中圖片設置熱點鏈接，可以設置兩個熱點區域嗎？