大學(xué)計算機ii課件 第7次課

1、第第7講講 創(chuàng)建網(wǎng)頁鏈接創(chuàng)建網(wǎng)頁鏈接參考資源：/dxjsj2/大學(xué)計算機11/26/20211廣東金融學(xué)院主要內(nèi)容主要內(nèi)容v1 1超鏈接的概念；超鏈接的概念；v2 2理解路徑；理解路徑；v3 3創(chuàng)建文本超鏈接、下載超鏈接和圖像創(chuàng)建文本超鏈接、下載超鏈接和圖像超鏈接；超鏈接；v4 4創(chuàng)建錨點鏈接和創(chuàng)建錨點鏈接和e-maile-mail鏈接；鏈接；v5 5求職站點的頁面導(dǎo)航；求職站點的頁面導(dǎo)航；v6 6總結(jié)并布置作業(yè)?？偨Y(jié)并布置作業(yè)。11/26/2021廣東金融學(xué)院21超鏈接的概念超鏈接的概念v什么是超鏈接什么是超鏈接 超鏈接（簡稱鏈接）是網(wǎng)頁文檔中的重要元超鏈

2、接（簡稱鏈接）是網(wǎng)頁文檔中的重要元素，使用超鏈接可以實現(xiàn)網(wǎng)頁文檔之間的快素，使用超鏈接可以實現(xiàn)網(wǎng)頁文檔之間的快速跳轉(zhuǎn)，而不管這些網(wǎng)頁是來自一個站點，速跳轉(zhuǎn)，而不管這些網(wǎng)頁是來自一個站點，還是來自還是來自internetinternet中不同的站點。中不同的站點。 網(wǎng)頁中超鏈接通常以文本、圖像或動畫等形網(wǎng)頁中超鏈接通常以文本、圖像或動畫等形式出現(xiàn)。當(dāng)鼠標(biāo)指針指向超鏈接時，鼠標(biāo)指式出現(xiàn)。當(dāng)鼠標(biāo)指針指向超鏈接時，鼠標(biāo)指針會變成手指狀；單擊超鏈接時，瀏覽器就針會變成手指狀；單擊超鏈接時，瀏覽器就會按照超鏈接指向的目標(biāo)載入另一個網(wǎng)頁，會按照超鏈接指向的目標(biāo)載入另一個網(wǎng)頁，或者跳轉(zhuǎn)到同一網(wǎng)頁（也可以是其他

3、網(wǎng)頁）或者跳轉(zhuǎn)到同一網(wǎng)頁（也可以是其他網(wǎng)頁）的某一個位置。的某一個位置。11/26/2021廣東金融學(xué)院31超鏈接的概念超鏈接的概念v源端點和目標(biāo)端點源端點和目標(biāo)端點 超鏈接是由源端點到目標(biāo)端點的一種跳轉(zhuǎn)。超鏈接是由源端點到目標(biāo)端點的一種跳轉(zhuǎn)。 源端點可以是網(wǎng)頁中的一段文本、一幅圖像源端點可以是網(wǎng)頁中的一段文本、一幅圖像或圖像熱區(qū)等?；驁D像熱區(qū)等。 目標(biāo)端點可以是任意類型的網(wǎng)絡(luò)資源，例如目標(biāo)端點可以是任意類型的網(wǎng)絡(luò)資源，例如一個網(wǎng)頁、一幅圖像、一首音樂、一段動畫一個網(wǎng)頁、一幅圖像、一首音樂、一段動畫、一段電影或一個程序等。、一段電影或一個程序等。11/26/2021廣東金融學(xué)院41超鏈接的概念

4、超鏈接的概念v源端點和目標(biāo)端點源端點和目標(biāo)端點11/26/2021廣東金融學(xué)院5文本圖像熱區(qū)其它網(wǎng)頁其它文件錨點e-mail圖像聲音程序鏈接源端點鏈接目標(biāo)端點1超鏈接的概念超鏈接的概念v超鏈接分類（按照目標(biāo)端點的不同）超鏈接分類（按照目標(biāo)端點的不同） 文件鏈接：目標(biāo)端點是一個文件（通常是網(wǎng)文件鏈接：目標(biāo)端點是一個文件（通常是網(wǎng)頁文件，也可以是其它文件），用于打開另頁文件，也可以是其它文件），用于打開另外一個網(wǎng)頁，或者將一個文件直接下載到本外一個網(wǎng)頁，或者將一個文件直接下載到本地計算機中。地計算機中。 錨點鏈接：目標(biāo)端點是網(wǎng)頁中的某個位置，錨點鏈接：目標(biāo)端點是網(wǎng)頁中的某個位置，用于快速跳轉(zhuǎn)到當(dāng)前

5、網(wǎng)頁或其它網(wǎng)頁中的某用于快速跳轉(zhuǎn)到當(dāng)前網(wǎng)頁或其它網(wǎng)頁中的某個位置。個位置。 e-maile-mail鏈接：目標(biāo)端點是一個發(fā)送郵件的客鏈接：目標(biāo)端點是一個發(fā)送郵件的客戶端程序（如戶端程序（如foxmailfoxmail、outlookoutlook等），用于等），用于啟動一個郵件客戶端程序，并向某個電子郵啟動一個郵件客戶端程序，并向某個電子郵箱發(fā)送郵件。箱發(fā)送郵件。11/26/2021廣東金融學(xué)院62理解路徑理解路徑v什么是路徑？什么是路徑？ 路徑是指文件或其它資源（如郵件或錨點等路徑是指文件或其它資源（如郵件或錨點等）在本地計算機或網(wǎng)絡(luò)中的存儲位置，通常）在本地計算機或網(wǎng)絡(luò)中的存儲位置，通常用

6、用urlurl（統(tǒng)一資源定位器）表示。（統(tǒng)一資源定位器）表示。 文件鏈接通常要指定目標(biāo)端點的文件位置，文件鏈接通常要指定目標(biāo)端點的文件位置，因此創(chuàng)建超鏈接前，理解文件路徑是非常關(guān)因此創(chuàng)建超鏈接前，理解文件路徑是非常關(guān)鍵的一步。鍵的一步。11/26/2021廣東金融學(xué)院72理解路徑理解路徑vurlurl的格式的格式 http:/http:/：指明文件在網(wǎng)絡(luò)中傳輸?shù)膮f(xié)議是：指明文件在網(wǎng)絡(luò)中傳輸?shù)膮f(xié)議是超文本傳輸協(xié)議。超文本傳輸協(xié)議。 webweb服務(wù)器服務(wù)器ipip或域名：用于指定是網(wǎng)絡(luò)中的或域名：用于指定是網(wǎng)絡(luò)中的哪一臺計算機。哪一臺計算機。 文件目錄：就是文件目錄：就是webweb站點的目錄，

7、通常站點站點的目錄，通常站點中的文件資源都放在這個目錄中。中的文件資源都放在這個目錄中。 文件名：包括文件主名和擴展名。文件名：包括文件主名和擴展名。11/26/2021廣東金融學(xué)院8http:/web服務(wù)器ip地址或域名/文件目錄./文件名2理解路徑理解路徑vurlurl的唯一性的唯一性 網(wǎng)絡(luò)中計算機的網(wǎng)絡(luò)中計算機的ipip地址（或域名）唯一。地址（或域名）唯一。 網(wǎng)絡(luò)中每臺計算機中的文件路徑唯一。網(wǎng)絡(luò)中每臺計算機中的文件路徑唯一。 因此，由于因此，由于urlurl特殊的層次性結(jié)構(gòu)，使得在特殊的層次性結(jié)構(gòu)，使得在網(wǎng)絡(luò)中，每個文件的網(wǎng)絡(luò)中，每個文件的urlurl是唯一的。是唯一的。11/26/

8、2021廣東金融學(xué)院92理解路徑理解路徑v路徑的類型路徑的類型 絕對路徑絕對路徑 也稱絕對也稱絕對urlurl，它給出鏈接目標(biāo)文件的完整，它給出鏈接目標(biāo)文件的完整urlurl地地址，包括傳輸協(xié)議在內(nèi)，如址，包括傳輸協(xié)議在內(nèi)，如https:/ 如果鏈接的目標(biāo)文件不在當(dāng)前如果鏈接的目標(biāo)文件不在當(dāng)前webweb站點內(nèi)，必須站點內(nèi)，必須使用絕對路徑。使用絕對路徑。11/26/2021廣東金融學(xué)院102理解路徑理解路徑v路徑的類型路徑的類型 相對路徑相對路徑 也稱為相對也稱為相對urlurl，是指以當(dāng)前文件所在位置為起，是指以當(dāng)前文件所在位置為起點到目標(biāo)文檔所經(jīng)過的路徑，如點到目標(biāo)文檔所經(jīng)過的路徑，如“

9、products/dreamweaver.html”。若要將當(dāng)前。若要將當(dāng)前文件與處在同一文件夾中的另一個文件鏈接，或文件與處在同一文件夾中的另一個文件鏈接，或者將同一站點中不同文件夾下的文件相互鏈接，者將同一站點中不同文件夾下的文件相互鏈接，都可以使用相對路徑，此時可以省去當(dāng)前文件與都可以使用相對路徑，此時可以省去當(dāng)前文件與目標(biāo)文檔完整目標(biāo)文檔完整urlurl中的相同部分，只留下不同部中的相同部分，只留下不同部分。分。11/26/2021廣東金融學(xué)院112理解路徑理解路徑v路徑的類型路徑的類型 根相對路徑根相對路徑 是指從站點根目錄到被鏈接文件的路徑，如是指從站點根目錄到被鏈接文件的路徑，如

10、“/ /products/dreamweaver.html”。實際上，根。實際上，根相對路徑是站點內(nèi)部的相對路徑是站點內(nèi)部的“絕對路徑絕對路徑”，因此服務(wù)，因此服務(wù)器地址加上根相對路徑就形成絕對路徑了。器地址加上根相對路徑就形成絕對路徑了。 根相對路徑適用于當(dāng)前網(wǎng)頁文檔和鏈接目標(biāo)端點根相對路徑適用于當(dāng)前網(wǎng)頁文檔和鏈接目標(biāo)端點文件處于相同站點中的情況。文件處于相同站點中的情況。11/26/2021廣東金融學(xué)院123文本鏈接、下載鏈接和圖像鏈接文本鏈接、下載鏈接和圖像鏈接v文本超鏈接文本超鏈接 是指源端點是文本的超鏈接。是指源端點是文本的超鏈接。v下載鏈接下載鏈接 是一種特殊的文件超鏈接，即當(dāng)打開

11、超鏈接是一種特殊的文件超鏈接，即當(dāng)打開超鏈接的瀏覽器不能顯示（或默認(rèn)顯示）目標(biāo)端點的瀏覽器不能顯示（或默認(rèn)顯示）目標(biāo)端點文件中的內(nèi)容時，瀏覽器將自動提示下載對文件中的內(nèi)容時，瀏覽器將自動提示下載對話框。話框。v圖像超鏈接圖像超鏈接 是指源端點是圖像中熱點的超鏈接。是指源端點是圖像中熱點的超鏈接。11/26/2021廣東金融學(xué)院133文本鏈接、下載鏈接和圖像鏈接文本鏈接、下載鏈接和圖像鏈接v新建超鏈接的方法新建超鏈接的方法 使用菜單命令使用菜單命令 使用使用“屬性屬性”面板面板11/26/2021廣東金融學(xué)院144創(chuàng)建錨點鏈接和創(chuàng)建錨點鏈接和e-mail鏈接鏈接v錨點鏈接錨點鏈接 當(dāng)網(wǎng)頁內(nèi)容很長

12、時，可以使用錨點超鏈接快當(dāng)網(wǎng)頁內(nèi)容很長時，可以使用錨點超鏈接快速定位到網(wǎng)頁文檔的指定位置，加快頁面瀏速定位到網(wǎng)頁文檔的指定位置，加快頁面瀏覽速度。覽速度。v創(chuàng)建錨點鏈接一般分為兩個步驟：創(chuàng)建錨點鏈接一般分為兩個步驟： 首先，在頁面的某處設(shè)置一個命名標(biāo)記（即首先，在頁面的某處設(shè)置一個命名標(biāo)記（即錨點）；錨點）； 其次，創(chuàng)建錨點鏈接，并使鏈接目標(biāo)指向一其次，創(chuàng)建錨點鏈接，并使鏈接目標(biāo)指向一個錨點。這樣，瀏覽者單擊錨點鏈接就可以個錨點。這樣，瀏覽者單擊錨點鏈接就可以跳轉(zhuǎn)到錨點位置。跳轉(zhuǎn)到錨點位置。11/26/2021廣東金融學(xué)院154創(chuàng)建錨點鏈接和創(chuàng)建錨點鏈接和e-mail鏈接鏈接v創(chuàng)建錨點鏈接創(chuàng)建

13、錨點鏈接11/26/2021廣東金融學(xué)院164創(chuàng)建錨點鏈接和創(chuàng)建錨點鏈接和e-mail鏈接鏈接ve-maile-mail超鏈接超鏈接 為了讓瀏覽者單擊為了讓瀏覽者單擊e-maile-mail超鏈接時，能正常超鏈接時，能正常發(fā)送電子郵件，必須為發(fā)送電子郵件，必須為e-maile-mail超鏈接指定一超鏈接指定一個合法的目標(biāo)端點。個合法的目標(biāo)端點。ve-maile-mail超鏈接的目標(biāo)端點格式為：超鏈接的目標(biāo)端點格式為：mailto:mailto:電子郵件地址電子郵件地址v創(chuàng)建創(chuàng)建e-maile-mail鏈接鏈接11/26/2021廣東金融學(xué)院175求職站點的頁面導(dǎo)航求職站點的頁面導(dǎo)航v個人求職站

14、點整體架構(gòu)個人求職站點整體架構(gòu)11/26/2021廣東金融學(xué)院18求職站點首頁個人簡歷我的專業(yè)才藝展示求職意向我的同學(xué)母校風(fēng)采我的相冊給我留言5求職站點的頁面導(dǎo)航求職站點的頁面導(dǎo)航v個人求職站點整體架構(gòu)個人求職站點整體架構(gòu)11/26/2021廣東金融學(xué)院19鏈接文本鏈接文本目標(biāo)文件路徑目標(biāo)文件路徑鏈接文本鏈接文本目標(biāo)文件路徑目標(biāo)文件路徑我的專業(yè)specialty.html母校風(fēng)采school.html才藝展示gift.html我的相冊album.html求職意向will.html給我留言messageboard.html我的同學(xué)schoolmate.html返回主頁index.html6總結(jié)并布置作業(yè)總結(jié)并布置作業(yè)v總結(jié)總結(jié) 1) 1) 超鏈接和路徑的概念超鏈接和路徑的概念 2) 2) 常見的超鏈接形式及創(chuàng)建方法常見的超鏈接形式及創(chuàng)建方法 3) 3) 頁面導(dǎo)航的制作方法頁面導(dǎo)航的制作方法11/26/2021廣東金融學(xué)院206總結(jié)并布置作業(yè)總結(jié)并布置作業(yè)v作業(yè)作業(yè) 1) 1) 給班級管