網(wǎng)頁制作與網(wǎng)站設(shè)計-05DreamweaverCS3創(chuàng)建超級鏈接

項目五DreamweaverCS3創(chuàng)建超級鏈接

網(wǎng)頁制作技能訓(xùn)練項目五

任務(wù)一創(chuàng)建超級鏈接的方法

任務(wù)二

文字超級鏈接任務(wù)三任務(wù)四任務(wù)五

圖片超級鏈接

創(chuàng)建E-mail鏈接創(chuàng)建錨點鏈接網(wǎng)頁網(wǎng)頁制作技能訓(xùn)練項目五

任務(wù)一創(chuàng)建超級鏈接的方法

課程導(dǎo)航任務(wù)一

任務(wù)描述任務(wù)說明操作步驟任務(wù)一小張要建立一個美觀的網(wǎng)頁需要加入許多圖片、文字資料、影像、音樂等，下面我們就學(xué)習(xí)有關(guān)創(chuàng)建超級鏈接的操作界面。任務(wù)描述課程導(dǎo)航任務(wù)一

任務(wù)描述

任務(wù)說明實現(xiàn)過程任務(wù)一通過使用使用菜單創(chuàng)建鏈接。任務(wù)說明課程導(dǎo)航任務(wù)一

任務(wù)描述任務(wù)說明

操作步驟任務(wù)一1）在菜單欄中選擇“插入記錄”“超級鏈接”，彈出“超級鏈接”對話框，在對話柜中輸入相應(yīng)的鏈接文件，或者單擊“常用”插入欄中的“超級鏈接”按鈕，也會打開“超級鏈接”對話框，如圖5-1所示。操作步驟課程導(dǎo)航任務(wù)一

任務(wù)描述任務(wù)說明

操作步驟

任務(wù)一操作步驟圖5-1超級鏈接對話框課程導(dǎo)航任務(wù)一

任務(wù)描述任務(wù)說明

操作步驟

任務(wù)一在“超級鏈接”對話框中可以設(shè)置的參數(shù)如下：①“文本”:設(shè)置超級鏈接顯示的文本。②“鏈接”:設(shè)置超級鏈接鏈接到的路徑，最好輸入相對路徑而不是絕對路徑。③“目標”:設(shè)置在何處打開網(wǎng)頁，包括4個選項，這四個選項是“_blank”；“_parent”；“_self”；“_top”,如圖5-2所示,具體的功能如下。操作步驟課程導(dǎo)航任務(wù)一

任務(wù)描述任務(wù)說明

操作步驟任務(wù)一“_blank”:在彈出的新窗口中打開所鏈接的目標?！癬parent”:如果是嵌套的框架，表示在父框架“_self”:瀏覽器默認的設(shè)置，在當前網(wǎng)頁所在的窗口中打開鏈接的網(wǎng)頁?！癬top”:在完整的瀏覽器窗口的頂層打開鏈接目標。課程導(dǎo)航任務(wù)一

任務(wù)描述任務(wù)說明

操作步驟任務(wù)一圖5-2目標選項操作步驟課程導(dǎo)航任務(wù)一

任務(wù)描述任務(wù)說明

操作步驟任務(wù)一④“標題”:設(shè)置超鏈接的標題。當鼠標懸停在超級鏈接上時出現(xiàn)的說明文字。⑤“訪問鍵”:設(shè)置鍵盤快捷鍵，設(shè)置好后，如果按鍵盤上的快捷鍵將選中這個超級鏈接。⑥“Tab鍵索引”:設(shè)置在網(wǎng)頁中用Tab鍵選中這個超鏈接的順序。2）完成參數(shù)設(shè)置后，單擊“確定”按鈕，即可完成鏈接。操作步驟課程導(dǎo)航任務(wù)一

任務(wù)描述任務(wù)說明

操作步驟任務(wù)一①使用“屬性”面板創(chuàng)建鏈接。

“屬性”面板面板中的“鏈接”文本框可用于創(chuàng)建鏈接，在【文檔】中選擇圖像或文本，打開“屬性”面板，在“鏈接”文本框中輸入鏈接的文件，從“目標”下拉列表框中選擇文檔位置，如圖5-3所示。課程導(dǎo)航任務(wù)一

任務(wù)描述任務(wù)說明

操作步驟任務(wù)一圖5-3屬性面板課程導(dǎo)航任務(wù)一

任務(wù)描述任務(wù)說明

操作步驟任務(wù)一②使用指向文件圖標創(chuàng)建鏈接在“屬性”面板中，單擊“鏈接”文本框右側(cè)的指向文件圖標，拖動鼠標時會出現(xiàn)一條帶箭頭的細線，指示到鏈接的文件后，釋放鼠標，可以鏈接該文件⑻如圖5-4所示。課程導(dǎo)航任務(wù)一

任務(wù)描述任務(wù)說明

操作步驟任務(wù)一圖5-4創(chuàng)建指向文件圖標鏈接課程導(dǎo)航任務(wù)二

任務(wù)描述任務(wù)說明操作步奏

任務(wù)二小張在瀏覽網(wǎng)頁時，看見鼠標經(jīng)過某些文本時，會出現(xiàn)一個小手，點擊后會出現(xiàn)新的窗口，自己也想試一試。任務(wù)描述課程導(dǎo)航任務(wù)二

任務(wù)描述

任務(wù)說明操作步驟任務(wù)二任務(wù)說明當瀏覽網(wǎng)頁時，鼠標經(jīng)過某些文本時，會出現(xiàn)一個小手，提示瀏覽者這是帶鏈接的文本。此時單擊鼠標左鍵，會打開所鏈接的網(wǎng)頁。這就是文本超級鏈接。課程導(dǎo)航任務(wù)二

任務(wù)描述任務(wù)說明

操作步驟任務(wù)二操作步驟

1）打開網(wǎng)頁文檔，選中要創(chuàng)建鏈接的文本，如圖5-5所示。圖5-5打開網(wǎng)頁文檔選中文本課程導(dǎo)航任務(wù)二

任務(wù)描述任務(wù)說明

操作步驟任務(wù)二操作步驟：

2）打開“屬性”面板，在面板中單擊“鏈接”文本框右邊的文件夾圖標，在彈出的對話框中選擇鏈接的文件，將文件添加到“鏈接”文本框中，如圖5-6所示。圖5-6創(chuàng)建鏈接課程導(dǎo)航任務(wù)二

任務(wù)描述任務(wù)說明

操作步驟任務(wù)二操作步驟：（3)按F12鍵，保存網(wǎng)頁文檔并在瀏覽器中檢驗該文檔，如圖5-7所示。圖5-7瀏覽效果課程導(dǎo)航任務(wù)三

任務(wù)描述解決方案操作步驟任務(wù)三任務(wù)描述：

小張在瀏覽網(wǎng)頁時，單擊網(wǎng)頁中的某個小圖片時，會在新窗口中打開一幅大圖片，自己也想試一試。課程導(dǎo)航任務(wù)三

任務(wù)描述

任務(wù)說明操作步驟任務(wù)三制作一個瀏覽網(wǎng)頁時，經(jīng)常會用到圖片鏈接，單擊網(wǎng)頁中的某個小圖片時，會在新窗口中打開一幅大圖片，這就是圖片鏈接。任務(wù)說明：課程導(dǎo)航任務(wù)三

任務(wù)描述任務(wù)說明

操作步驟任務(wù)三操作步驟：

1）打開網(wǎng)頁文檔，選中要創(chuàng)建鏈接的圖片，在“源文件”文本框中顯示文件名，如圖5-8所示。圖5-8選中創(chuàng)建鏈接的圖片課程導(dǎo)航任務(wù)三操作步驟：

2）在“屬性”面板上的“鏈接”文本框中將鏈接目標設(shè)置為圖像文件或其他文件就可以了，如圖5-9所示。任務(wù)三

任務(wù)描述任務(wù)說明

操作步驟圖5-9設(shè)置鏈接目標課程導(dǎo)航任務(wù)三操作步驟：

3)按F12鍵，保存網(wǎng)頁文檔并在瀏覽器中檢驗該文檔。任務(wù)三

任務(wù)描述任務(wù)說明

操作步驟課程導(dǎo)航任務(wù)四任務(wù)描述：

小張想自己設(shè)立了一個網(wǎng)頁，在運行過程中可能會出現(xiàn)問題，通過瀏覽者能反饋的信息，及時改進，提高網(wǎng)頁的制作水平。任務(wù)四

任務(wù)描述任務(wù)說明操作步驟課程導(dǎo)航任務(wù)四

在網(wǎng)頁上創(chuàng)建E-mail鏈接，可以使瀏覽者快速反饋自己的意見，當瀏覽者單擊電子郵件鏈接時，系統(tǒng)會自動啟動默認的電子郵件收發(fā)軟件（如Outlook、OutlookExpress等），收件人郵件地址被電子郵件超級鏈接中指定的地址自動更新。任務(wù)四

任務(wù)描述

任務(wù)說明操作步驟任務(wù)說明：課程導(dǎo)航任務(wù)四操作步驟：

1）新建一個HTML文件，輸入一段文字，如圖5-10所示。任務(wù)四

任務(wù)描述任務(wù)說明

操作步驟圖5-10建立HTML文件課程導(dǎo)航任務(wù)四操作步驟：

2）在菜單欄中選擇“插入記錄”|“電子郵件鏈接”命令或點擊插入面板中“常用”標簽下的“電子郵件鏈接”按鈕，出現(xiàn)“電子郵件鏈接”對話框，在“E-mail”文本框中輸入郵箱地址，如圖5-11所示。任務(wù)四

任務(wù)描述任務(wù)說明

操作步驟圖5-11在“E-mail”文本框中輸入郵箱地址課程導(dǎo)航任務(wù)四操作步驟：

3）單擊“確定”按鈕，即可插入電子郵件鏈接。4）按F12鍵，保存文檔并預(yù)覽網(wǎng)頁，點擊E-mail的鏈接文字，網(wǎng)頁就會自動打開郵件處理程序，并在收件人欄中填寫好所設(shè)置的郵箱地址，如圖5-12所示。任務(wù)四

任務(wù)描述任務(wù)說明

操作步驟圖5-12E-mail鏈接效果課程導(dǎo)航任務(wù)五小張想自己設(shè)立了一個網(wǎng)頁，在運行過程中發(fā)現(xiàn)當文本內(nèi)容分成多頁時，不能快速找到需要內(nèi)容，有什么方法可以快速定位，方便查找需要的內(nèi)容嗎？任務(wù)五

任務(wù)描述任務(wù)說明操作步驟任務(wù)描述：課程導(dǎo)航任務(wù)五任務(wù)說明：錨點鏈接通常用于大量文本的網(wǎng)頁，由于網(wǎng)頁內(nèi)容非常多，瀏覽器的滾動條變得很長，而使瀏覽者無法快速找到所以內(nèi)容。使用錨點鏈接可以給文本分段，來為網(wǎng)頁添加內(nèi)部鏈接。單擊該鏈接，就可以跳到網(wǎng)頁中指定位置。任務(wù)五

任務(wù)描述

任務(wù)說明操作步驟課程導(dǎo)航任務(wù)五操作步驟：

1）打開一個長網(wǎng)頁文檔，如圖5-13所示

任務(wù)五

任務(wù)描述任務(wù)說明

操作步驟圖5-13打開網(wǎng)頁文檔課程導(dǎo)航任務(wù)五操作步驟：

2）將光標定位于第一首前，選擇菜單中的“插入記錄”“命名錨記”命令，或點擊插入面板中“常用”標簽下的“命名錨記”按鈕，彈出“命名錨記”對話框，在對話框中輸入“1”，如圖5-14所示。任務(wù)五

任務(wù)描述任務(wù)說明

操作步驟圖5-14命名錨記課程導(dǎo)航任務(wù)五操作步驟：

3）單擊“確定”按鈕，插入“錨記名稱1”，如圖5-15所示。任務(wù)五

任務(wù)描述任務(wù)說明

操作步驟圖5-15插入命名錨記1課程導(dǎo)航任務(wù)五操作步驟：

4）選擇文字1.長歌行(漢)漢樂府，在“屬性”面板的“鏈接”文本框中輸入錨記“#1”(英文輸入法下)，如圖5-16所示。任務(wù)五

任務(wù)描述任務(wù)說明

操作步驟圖5-16輸入鏈接課程導(dǎo)航任務(wù)五

5）將光標定位于第二首前，選擇菜單中的“插入記錄”“命名錨記”命令，或點擊插入面板中“常用”標簽下的“命名錨記”按鈕，彈出“命名錨記”對話框，在對話框中輸入“2”，如圖5-17所示任務(wù)五

任務(wù)描述任務(wù)說明

操作步驟操作步驟：圖5-17命名錨記課程導(dǎo)航任務(wù)五操作步驟：

6）單擊“確定”按鈕，插入“錨記名稱2”，如圖5-18所示。任務(wù)五

任務(wù)描述任務(wù)說明

操作步驟圖5-18插入命名錨記2課程導(dǎo)航任務(wù)五操作步驟：

7）選擇文字2.詠鵝(唐)駱賓王，在