1、第5章 插入多媒體內(nèi)容和超鏈接,隨著網(wǎng)絡(luò)的發(fā)展，多媒體在網(wǎng)絡(luò)上得到了更廣泛的應(yīng)用，因此，對網(wǎng)頁設(shè)計(jì)頁提出了更高地要求。在Dreamweaver CS3中，可以快速、方便地為網(wǎng)頁添加聲音、影片等多媒體內(nèi)容，使網(wǎng)頁更加生動，還可以插入和編輯多媒體文件和對象，例如Flash動畫、Java Applets、ActiveX控件等。網(wǎng)站都是由許多網(wǎng)頁組成的，網(wǎng)頁之間通常又是通過超鏈接方式相互建立關(guān)聯(lián)的。超鏈接的應(yīng)用范圍很廣，利用它不僅可以鏈接到其他網(wǎng)頁，還可以鏈接到其他圖像文件、多媒體文件及下載程序，也可以利用它在網(wǎng)頁內(nèi)部進(jìn)行鏈接或是發(fā)送E-mail等。在Dreamweaver CS3中，可以將文檔中的任

2、何文字及任意位置的圖片設(shè)置為超鏈接。超鏈接類型有頁間鏈接、頁內(nèi)鏈接、E-mail鏈接、空鏈接及腳本鏈接等。,教學(xué)重點(diǎn)與難點(diǎn),選擇對象 插入多媒體內(nèi)容 認(rèn)識超鏈接 創(chuàng)建超連接 管理超鏈接,5.1 插入多媒體內(nèi)容,在網(wǎng)頁中的插入多媒體內(nèi)容主要包括Flash動畫、音頻文件、視頻文件，插入這些對象可以增強(qiáng)網(wǎng)頁的互動性。 插入Flash動畫 插入其他媒體對象 插入音頻和視頻,5.1.1 插入Flash動畫,目前，F(xiàn)lash動畫使網(wǎng)頁上最流行的動畫格式，大量用于網(wǎng)頁中。在Dreamweaver中，F(xiàn)lash動畫也是最常用的多媒體插件之一，它將聲音、圖像和動畫等內(nèi)容加入到一個(gè)文件中，并能制作較好的動畫效果，

3、同時(shí)還使用了優(yōu)化的算法將多媒體數(shù)據(jù)進(jìn)行壓縮，是文件變得很小，因此，非常適合在網(wǎng)上傳播。,5.1.2 插入其他媒體對象,在Dreamweaver CS3中，除了插入Flash動畫、按鈕、文本對外外，還可以插入Shockwave影片、JavaScript、ActiveX控件。,5.1.3 插入音頻和視頻,現(xiàn)在瀏覽器能支持的多媒體文件越來越多，文件也越來越小，但表現(xiàn)的效果卻越來越好。在網(wǎng)頁中，還可以插入聲音和視頻文件，并可以在瀏覽器中播放。,5.2 創(chuàng)建超鏈接,超鏈接是Web的精華。沒有超鏈接，就無法通過單擊的方式遨游Web世界，而如果沒有了單擊的功能，Web就會是死水一潭。超鏈接的應(yīng)用范圍很廣，利

4、用它不僅可以鏈接到其他網(wǎng)頁，還可以鏈接到其他圖像文件、多媒體文件及下載程序，也可以利用它在網(wǎng)頁內(nèi)部進(jìn)行鏈接或是發(fā)送E-mail等。在Dreamweaver CS3中，可以將文檔中的任何文字及任意位置的圖片設(shè)置為超鏈接。 認(rèn)識超鏈接 超鏈接的類型 創(chuàng)建超鏈接的方法,5.2.1 認(rèn)識超鏈接,超鏈接與URL及網(wǎng)頁文件的存放路徑是緊密相關(guān)的。URL可以簡單地稱為網(wǎng)址，顧名思義，就是Internet文件在網(wǎng)上的地址，定義超鏈接其實(shí)就是指定一個(gè)URL地址來訪問它指向的Internet 資源。同時(shí)，認(rèn)識從作為鏈接起點(diǎn)的文檔到作為鏈接目標(biāo)的文檔之間的文件路徑，對于創(chuàng)建鏈接至關(guān)重要。一般來說，鏈接路徑可以分為絕

5、對路徑與相對路徑兩類。,5.2.2 超鏈接的類型,在Dreamweaver CS3中可以創(chuàng)建各種超鏈接。為了在本地站點(diǎn)內(nèi)移動或重命名文檔或其他鏈接文件時(shí)，依然可以自動更新指向文檔的鏈接Dreamweaver通常使用文檔相對路徑創(chuàng)建指定站點(diǎn)中其他網(wǎng)頁的鏈接。在Dreamweaver CS3中，可以創(chuàng)建 頁間鏈接：利用該鏈接可以跳轉(zhuǎn)到其他文檔或文件，如圖形、電影、PDF或聲音文件。 頁內(nèi)鏈接：也被稱為錨記鏈接，利用它可以跳轉(zhuǎn)到本站點(diǎn)指定文檔的位置。 E-mail鏈接：使用該鏈接，可以啟動電子郵件程序，允許用戶書寫電子郵件，并發(fā)送到指定地址。 空鏈接及腳本鏈接：它允許用戶附加行為至對象或創(chuàng)建一個(gè)執(zhí)行

6、JavaScript代碼的鏈接。,5.2.3 創(chuàng)建超鏈接的方法,在Dreamweaver CS3中，可以隨時(shí)隨地在所需的位置創(chuàng)建各種超級鏈接，并且可以通過多種方法來創(chuàng)建超鏈接，可以在“屬性”面板中創(chuàng)建、使用菜單命令創(chuàng)建或使用指向文件圖標(biāo)來創(chuàng)建超鏈接。,5.3 創(chuàng)建各種類型的超鏈接,在對超級鏈接有著一定初步了解的基礎(chǔ)上，將分類介紹各種超級鏈接的方法，包括創(chuàng)建文本超鏈接、圖像超鏈接、錨點(diǎn)鏈接、E-mail鏈接和圖形熱點(diǎn)鏈接。 創(chuàng)建文本超鏈接 創(chuàng)建圖像超鏈接 創(chuàng)建頁內(nèi)超鏈接 創(chuàng)建E-mail鏈接 創(chuàng)建虛鏈接和腳本鏈接 創(chuàng)建圖形熱點(diǎn)鏈接,5.3.1 創(chuàng)建文本超鏈接,當(dāng)光標(biāo)移至瀏覽器中的文本鏈接時(shí)，光標(biāo)

7、會變成一只手的形狀，此時(shí)單擊鏈接便可以打開鏈接所指向的目標(biāo)網(wǎng)頁。要創(chuàng)建文本超鏈接，首先選中要設(shè)置超鏈接的文本，在“屬性”面板中單擊“鏈接”文本框右側(cè)的文件夾圖標(biāo)，打開“選擇文件”對話框，選擇要鏈接的文件，單擊“確定”按鈕，即可將文件添加到“鏈接”文本框中，如圖所示。也可以在“鏈接”文本框中輸入鏈接的URL地址。,5.3.2 創(chuàng)建圖像超鏈接,創(chuàng)建圖像超鏈接的方法與創(chuàng)建文本超鏈接的方法相同。選中要創(chuàng)建超鏈接的圖像，打開“屬性”面板，單擊“鏈接”文本框右側(cè)的文件夾圖標(biāo)，打開“選擇文件”對話框，選擇要鏈接的文件，單擊“確定”按鈕，即可將文件添加到“鏈接”文本框中，也可以在“鏈接”文本框中輸入鏈接的UR

8、L地址。,5.3.3 創(chuàng)建頁內(nèi)超鏈接,創(chuàng)建頁內(nèi)超鏈接是通過使用“命名錨記”(用于標(biāo)記位置的標(biāo)識)來完成的，因此，“頁內(nèi)超鏈接”又稱為“命名錨記鏈接”。通過對文檔中指定位置的命名，允許利用鏈接打開目標(biāo)文檔時(shí)直接跳轉(zhuǎn)到相應(yīng)的命名位置。 創(chuàng)建“命名錨記鏈接”的過程分為兩步，首先加入一個(gè)命名錨記，可以將光標(biāo)置于文本中需要創(chuàng)建超鏈接的位置，然后選擇“插入記錄”|“命名錨記”命令，或者單擊“插入”欄中的“常用”選項(xiàng)卡，打開“常用”插入欄，單擊“命名標(biāo)記”按鈕，打開“命名錨記”對話框，如圖所示。在“錨記名稱”文本框中“輸入錨記”的名稱text_top，然后單擊“確定”按鈕即可。,5.3.4 創(chuàng)建E-mail

9、鏈接,E-mail鏈接是一種特殊的鏈接，單擊E-mail鏈接，可以打開一個(gè)空白通訊窗口。在E-mail通訊窗口中，可以創(chuàng)建電子郵件，并發(fā)送到指定的地址，如圖所示。,5.3.5 創(chuàng)建虛鏈接和腳本鏈接,虛鏈接實(shí)際上是一個(gè)未設(shè)計(jì)的鏈接，使用虛鏈接可以激活頁面上的對象或文本。一旦對象或文本被激活，當(dāng)光標(biāo)經(jīng)過該鏈接時(shí)，可以附加行為來交換圖片或顯示層。要創(chuàng)建虛鏈接，選中所需創(chuàng)建鏈接的文字或圖片后，打開“屬性”面板，在“鏈接”文本框中輸入javascript:;(javascript一詞后依次接一個(gè)冒號和一個(gè)分號)或是一個(gè)#號即可。 腳本鏈接是指執(zhí)行JavaScript代碼或調(diào)用JavaScript函數(shù)。創(chuàng)

10、建腳本鏈接后，在不離開當(dāng)前頁面的情況下可以了解關(guān)于某個(gè)項(xiàng)目的一些附加信息。常用于執(zhí)行計(jì)算、表單驗(yàn)證或其他任務(wù)。,5.3.6 創(chuàng)建圖形熱點(diǎn)鏈接,在創(chuàng)建圖形鏈接的過程中，當(dāng)圖片比較大，或是要創(chuàng)建鏈接的區(qū)域是不規(guī)則區(qū)域，或是只給圖片中部分區(qū)域創(chuàng)建鏈接，在這些情況下，可以將圖片分為幾個(gè)區(qū)(又稱為“熱點(diǎn)”)，單擊不同的區(qū)域可以打開不同的鏈接，這樣的鏈接就稱為“圖形熱點(diǎn)鏈接”。在圖像的“屬性”面板中可以方便地創(chuàng)建圖形熱點(diǎn)鏈接。,5.4 管理超鏈接,超鏈接是網(wǎng)頁中不可缺少的一部分，通過超鏈接可以使各個(gè)網(wǎng)頁鏈接起來，使網(wǎng)站中眾多的網(wǎng)頁構(gòu)成一個(gè)有機(jī)的整體，通過管理網(wǎng)頁中的超鏈接，可以對網(wǎng)頁進(jìn)行相應(yīng)的管理。 自動

11、更新鏈接 更改超鏈接 在“站點(diǎn)地圖”中創(chuàng)建和修改鏈接,5.4.1 自動更新鏈接,在站點(diǎn)內(nèi)移動或重命名文檔時(shí)，Dreamweaver會自動更新指向該文檔的鏈接，將整個(gè)站點(diǎn)存儲在本地磁盤上時(shí)，自動更新鏈接功能最適用，但要注意的是，Dreamweaver不會更改遠(yuǎn)程文件夾中的相應(yīng)文件。為了加快更新速度，Dreamweaver會創(chuàng)建一個(gè)緩存文件，用來存儲跟本地文件夾有關(guān)的所有鏈接信息，在添加、刪除或更改指向本地站點(diǎn)上的文件的鏈接時(shí)，該緩存文件會以可見方式進(jìn)行更新。,5.4.2 更改超鏈接,除了自動更新鏈接外，還可以手動更改所有創(chuàng)建的超鏈接，以指向其他位置。 要手動更改所有創(chuàng)建的超鏈接，打開一個(gè)文件，選擇“站點(diǎn)”|“改變站點(diǎn)鏈接范圍的鏈接”命令，打開“更改整個(gè)站點(diǎn)鏈接”對話框，如圖所示。在“變成新