《《網(wǎng)頁設(shè)計(jì)與制作實(shí)例教程》第5章(蔣舒靜)ppt課件(全).ppt》由會(huì)員分享，可在線閱讀，更多相關(guān)《《網(wǎng)頁設(shè)計(jì)與制作實(shí)例教程》第5章(蔣舒靜)ppt課件(全).ppt（16頁珍藏版）》請?jiān)趨R文網(wǎng)上搜索。

1、清華大學(xué)出版社 網(wǎng)頁設(shè)計(jì)與制作實(shí)例教程第5章高等學(xué)校計(jì)算機(jī)應(yīng)用規(guī)劃教材 2022/9/11主編 方其桂內(nèi)容提要第5章 設(shè)置網(wǎng)頁超級(jí)鏈接網(wǎng)絡(luò)世界里，超級(jí)鏈接無處不在。通過超級(jí)鏈接可以將因特網(wǎng)絡(luò)世界里，超級(jí)鏈接無處不在。通過超級(jí)鏈接可以將因特網(wǎng)上的各種相關(guān)信息有機(jī)地聯(lián)系起來，能很方便地從一個(gè)網(wǎng)頁跳網(wǎng)上的各種相關(guān)信息有機(jī)地聯(lián)系起來，能很方便地從一個(gè)網(wǎng)頁跳轉(zhuǎn)到另一個(gè)網(wǎng)頁，從而可以方便的查詢到所需要的資源。轉(zhuǎn)到另一個(gè)網(wǎng)頁，從而可以方便的查詢到所需要的資源。本章通過多個(gè)實(shí)例，從超級(jí)鏈接的基本概念、創(chuàng)建和管理三本章通過多個(gè)實(shí)例，從超級(jí)鏈接的基本概念、創(chuàng)建和管理三個(gè)方面，介紹超級(jí)鏈接在網(wǎng)頁中的相關(guān)應(yīng)用。個(gè)方面

2、，介紹超級(jí)鏈接在網(wǎng)頁中的相關(guān)應(yīng)用。教學(xué)目錄認(rèn)識(shí)超級(jí)鏈接認(rèn)識(shí)超級(jí)鏈接創(chuàng)建超級(jí)鏈接創(chuàng)建超級(jí)鏈接管理超級(jí)鏈接管理超級(jí)鏈接010203第5章 設(shè)置網(wǎng)頁超級(jí)鏈接5.1 認(rèn)識(shí)超級(jí)鏈接教學(xué)內(nèi)容5.1.1 5.1.1 超級(jí)鏈接定義與分類超級(jí)鏈接定義與分類超級(jí)鏈接在本質(zhì)上屬于一個(gè)超級(jí)鏈接在本質(zhì)上屬于一個(gè)網(wǎng)頁網(wǎng)頁的一部分，它是一種允許同其他網(wǎng)頁的一部分，它是一種允許同其他網(wǎng)頁或站點(diǎn)之間進(jìn)行連接的元素。各個(gè)網(wǎng)頁鏈接在一起后，才能真正構(gòu)成一個(gè)網(wǎng)或站點(diǎn)之間進(jìn)行連接的元素。各個(gè)網(wǎng)頁鏈接在一起后，才能真正構(gòu)成一個(gè)網(wǎng)站。站。1.超鏈接定義2.超鏈接分類第5章 設(shè)置超級(jí)鏈接5.1.2 URL5.1.2 URL簡介簡介URL(U

3、niform Resource Locator，統(tǒng)一資源定位符，統(tǒng)一資源定位符)，簡稱網(wǎng)址。，簡稱網(wǎng)址?；ヂ?lián)網(wǎng)上的每個(gè)文件都有一個(gè)唯一的互聯(lián)網(wǎng)上的每個(gè)文件都有一個(gè)唯一的URL，它包含的信息指出文件的位，它包含的信息指出文件的位置以及瀏覽器應(yīng)該怎么處理它。置以及瀏覽器應(yīng)該怎么處理它。5.1.3 5.1.3 超級(jí)鏈接的路徑超級(jí)鏈接的路徑絕對路徑絕對路徑 根目錄相對路徑根目錄相對路徑 文檔目錄相對路徑文檔目錄相對路徑 5.2 創(chuàng)建超級(jí)鏈接教學(xué)內(nèi)容第5章 設(shè)置超級(jí)鏈接5.2.1 5.2.1 創(chuàng)建圖像超鏈接創(chuàng)建圖像超鏈接給網(wǎng)頁上的圖像設(shè)置超鏈接，使得用戶通過單擊圖像就可以打開相應(yīng)給網(wǎng)頁上的圖像設(shè)置超鏈接

4、，使得用戶通過單擊圖像就可以打開相應(yīng)的內(nèi)容，讓網(wǎng)頁更加生動(dòng)。例如常見的友情鏈接，可以將站點(diǎn)頁面鏈接到本的內(nèi)容，讓網(wǎng)頁更加生動(dòng)。例如常見的友情鏈接，可以將站點(diǎn)頁面鏈接到本地站點(diǎn)以外的頁面，設(shè)計(jì)者需要事先給相應(yīng)的圖像指定一個(gè)完整的地址地站點(diǎn)以外的頁面，設(shè)計(jì)者需要事先給相應(yīng)的圖像指定一個(gè)完整的地址。實(shí)例1 創(chuàng)建友情鏈接在網(wǎng)頁文檔中插入3張圖像，并將它們用新窗口的方式分別鏈接到相應(yīng)的網(wǎng)頁，如下圖所示。5.2 創(chuàng)建超級(jí)鏈接教學(xué)內(nèi)容第5章 設(shè)置超級(jí)鏈接5.2.2 5.2.2 創(chuàng)建文本超鏈接創(chuàng)建文本超鏈接文本超鏈接的創(chuàng)建，有多種方法，可以在文本超鏈接的創(chuàng)建，有多種方法，可以在“鏈接鏈接”文本框中輸入內(nèi)容，文

5、本框中輸入內(nèi)容，也可以利用工具按鈕來創(chuàng)建鏈接。也可以利用工具按鈕來創(chuàng)建鏈接。實(shí)例2 安徽省各地簡介給網(wǎng)頁中的文本“淮北”、“合肥”、“阜陽”、“宿州”創(chuàng)建超鏈接，效果如下圖所示。5.2 創(chuàng)建超級(jí)鏈接教學(xué)內(nèi)容第5章 設(shè)置超級(jí)鏈接5.2.3 5.2.3 創(chuàng)建電子郵件超鏈接創(chuàng)建電子郵件超鏈接電子郵件超鏈接是一種特殊的鏈接，單擊其時(shí)，將打開一個(gè)新的空白電子郵件超鏈接是一種特殊的鏈接，單擊其時(shí)，將打開一個(gè)新的空白郵件窗口，在郵件窗口，在“收件人收件人”欄里將自動(dòng)顯示電子郵件鏈接中指定的地址。欄里將自動(dòng)顯示電子郵件鏈接中指定的地址。實(shí)例3 創(chuàng)建電子郵件超鏈接給網(wǎng)頁中的文字或者圖像創(chuàng)建電子郵件超鏈接，使得單

6、擊其時(shí)，打開如下圖的發(fā)送郵件的窗口。5.2 創(chuàng)建超級(jí)鏈接教學(xué)內(nèi)容第5章 設(shè)置超級(jí)鏈接5.2.4 5.2.4 創(chuàng)建錨記超鏈接創(chuàng)建錨記超鏈接錨記鏈接是指鏈接到同一頁面中不同位置的鏈接。例如，當(dāng)一個(gè)頁錨記鏈接是指鏈接到同一頁面中不同位置的鏈接。例如，當(dāng)一個(gè)頁面較長時(shí)，為了方便用戶瀏覽網(wǎng)頁，可以在頁面底部設(shè)置一個(gè)錨記鏈接，面較長時(shí)，為了方便用戶瀏覽網(wǎng)頁，可以在頁面底部設(shè)置一個(gè)錨記鏈接，單擊后可以快速跳轉(zhuǎn)到頁面頂部。單擊后可以快速跳轉(zhuǎn)到頁面頂部。實(shí)例4 返回頁首打開光盤中的網(wǎng)頁5-2.html文件，實(shí)現(xiàn)單擊“返回頁首”后返回到頁首的功能，效果如下圖所示。單擊回到頁首5.2 創(chuàng)建超級(jí)鏈接教學(xué)內(nèi)容實(shí)例6 創(chuàng)

7、建腳本鏈接打開光盤中的5-2.html文件，給文本“關(guān)閉窗口”創(chuàng)建腳本鏈接，當(dāng)單擊其時(shí)，系統(tǒng)將彈出如下圖所示的“關(guān)閉”對話框。第5章 設(shè)置超級(jí)鏈接5.2.5 5.2.5 創(chuàng)建空鏈接及腳本鏈接創(chuàng)建空鏈接及腳本鏈接腳本鏈接是可以執(zhí)行腳本鏈接是可以執(zhí)行JavaScript語句的鏈接，其通過鏈接觸發(fā)腳本命語句的鏈接，其通過鏈接觸發(fā)腳本命令，通常有添加到收藏夾，關(guān)閉窗口等腳本代碼可以調(diào)用。令，通常有添加到收藏夾，關(guān)閉窗口等腳本代碼可以調(diào)用。實(shí)例5 創(chuàng)建空鏈接打開5-2.html，給文本“1.電子信息工程”創(chuàng)建空鏈接?？真溄邮且粋€(gè)未指派的鏈接，利用該鏈接可激活頁面上的對象。5.2 創(chuàng)建超級(jí)鏈接教學(xué)內(nèi)容實(shí)例

8、7 下載VB軟件的超鏈接打開光盤中的5-2.html文件，給文本“VB軟件下載”創(chuàng)建下載文件超鏈接，當(dāng)單擊其時(shí)，系統(tǒng)將彈出下載文件的對話框，如下圖所示。第5章 設(shè)置超級(jí)鏈接5.2.6 5.2.6 創(chuàng)建下載文件超鏈接創(chuàng)建下載文件超鏈接網(wǎng)站中經(jīng)常提供一些下載文件的鏈接，單擊這些鏈接，就可以直接網(wǎng)站中經(jīng)常提供一些下載文件的鏈接，單擊這些鏈接，就可以直接下載文件，這些超鏈接指向的不是網(wǎng)頁，而是其他文件，例如下載文件，這些超鏈接指向的不是網(wǎng)頁，而是其他文件，例如rar、mp3或者或者exe文件等。文件等。5.2 創(chuàng)建超級(jí)鏈接教學(xué)內(nèi)容第5章 設(shè)置超級(jí)鏈接5.2.7 5.2.7 創(chuàng)建熱區(qū)超鏈接創(chuàng)建熱區(qū)超鏈接

9、當(dāng)制作的網(wǎng)頁是由圖片構(gòu)成的，可以使用熱點(diǎn)工具來給圖片的各個(gè)當(dāng)制作的網(wǎng)頁是由圖片構(gòu)成的，可以使用熱點(diǎn)工具來給圖片的各個(gè)部分建立不同的熱區(qū)鏈接，使頁面的導(dǎo)航結(jié)構(gòu)更加簡潔、明快。部分建立不同的熱區(qū)鏈接，使頁面的導(dǎo)航結(jié)構(gòu)更加簡潔、明快。實(shí)例8 創(chuàng)建熱區(qū)超鏈接打開網(wǎng)頁5-3.html，在中間單元格中插入所示圖片“shopping.jpg”，建立相應(yīng)的熱區(qū)鏈接，如下圖所示。5.3 管理超鏈接教學(xué)內(nèi)容5.3.1 5.3.1 自動(dòng)更新超鏈接自動(dòng)更新超鏈接第5章 設(shè)置網(wǎng)頁超級(jí)鏈接5.3.2 5.3.2 檢查鏈接錯(cuò)誤檢查鏈接錯(cuò)誤管理超鏈接是網(wǎng)站管理中不可或缺的一部分，通過超鏈接可以使管理超鏈接是網(wǎng)站管理中不可或缺

10、的一部分，通過超鏈接可以使各個(gè)網(wǎng)頁連接在一起，使網(wǎng)站中眾多頁面構(gòu)成一個(gè)有機(jī)整體。通過管各個(gè)網(wǎng)頁連接在一起，使網(wǎng)站中眾多頁面構(gòu)成一個(gè)有機(jī)整體。通過管理網(wǎng)頁中的超鏈接，可以對網(wǎng)頁進(jìn)行相應(yīng)管理，從而使得網(wǎng)站運(yùn)行的理網(wǎng)頁中的超鏈接，可以對網(wǎng)頁進(jìn)行相應(yīng)管理，從而使得網(wǎng)站運(yùn)行的更加流暢。更加流暢。5.4 小結(jié)和習(xí)題教學(xué)內(nèi)容5.4.1 5.4.1 本章小結(jié)本章小結(jié)5.4.2 5.4.2 強(qiáng)化練習(xí)強(qiáng)化練習(xí)第5章 設(shè)置網(wǎng)頁超級(jí)鏈接網(wǎng)絡(luò)中的所有資源都是通過超鏈接聯(lián)系在一起的，利用好超鏈接，可以讓網(wǎng)頁變得更加方便、清晰和更富有靈性。本章詳細(xì)介紹了超級(jí)鏈接的制作方法和技巧，具體包括以下主要內(nèi)容。1.超鏈接的基本概念

11、超鏈接的定義、分類、地址、URL等。2.創(chuàng)建超鏈接 主要介紹了在Dreamweaver中創(chuàng)建圖像超鏈接、文本超鏈接、電子郵件超鏈接、空鏈接和腳本超鏈接、下載文件超鏈接以及熱點(diǎn)超鏈接的方法。3.管理超鏈接 包括自動(dòng)更新和檢查鏈接錯(cuò)誤的方法。5.4 小結(jié)和習(xí)題教學(xué)內(nèi)容5.4.2 5.4.2 強(qiáng)化練習(xí)強(qiáng)化練習(xí)第5章 設(shè)置網(wǎng)頁超級(jí)鏈接 一、選擇題1要實(shí)現(xiàn)網(wǎng)頁上有如跳轉(zhuǎn)到頁首之類的鏈接，應(yīng)該使用的方法是()。A.表單 B.選擇“插入”“超級(jí)鏈接”命令 C.標(biāo)簽 D.選擇“插入”“命名錨記”命令2添加空鏈接時(shí)，應(yīng)選中對象，并在“鏈接”文本框中輸入()。A.*B.javascript C.javascrip

12、t;D.javascript:;3設(shè)置超級(jí)鏈接屬性時(shí)，目標(biāo)窗口設(shè)置為_blank時(shí)，表示的是()。A.會(huì)打開一個(gè)新的瀏覽器窗口來打開鏈接文檔 B.在當(dāng)前窗口的父窗口中打開鏈接C.在當(dāng)前窗口打開鏈接文檔D.在整個(gè)瀏覽器窗口中打開鏈接的文檔 4下列關(guān)于在一個(gè)文檔中可以創(chuàng)建的鏈接類型，說法錯(cuò)誤的是()。A.命名錨記鏈接，此類鏈接可跳轉(zhuǎn)至文檔中的指定位置 B.電子郵件鏈接，此類鏈接可新建一個(gè)收件人地址已填好的空白電子郵件C.鏈接到其他文檔或文件的鏈接 D.空鏈接，此類鏈接不能夠在對象上附加行為5在移動(dòng)熱點(diǎn)時(shí)，按下方向鍵的同時(shí)按下Ctrl鍵，每次移動(dòng)的距離為()。A.1像素 B.5像素 C.10像素 D.20像素5.4 小結(jié)和習(xí)題教學(xué)內(nèi)容5.4.2 5.4.2 強(qiáng)化練習(xí)強(qiáng)化練習(xí)第5章 設(shè)置網(wǎng)頁超級(jí)鏈接二、判斷題二、判斷題1設(shè)置電子郵件超鏈接時(shí)，在“鏈接”框中直接輸入郵箱地址即可，例如。()2使用根目錄相對路徑時(shí)，以“”開頭。()3超鏈接創(chuàng)建后無法刪除或更改。()4可以創(chuàng)建超鏈接的對象可以是文本、圖像、圖像的某一部分。()5在瀏覽器中單擊電子郵件鏈接后，會(huì)啟動(dòng)瀏覽器。()清華大學(xué)出版社 網(wǎng)頁設(shè)計(jì)與制作實(shí)例教程高等學(xué)校計(jì)算機(jī)應(yīng)用規(guī)劃教材 謝謝使用！聯(lián)系信箱：