【文章內(nèi)容簡介】 ver MX2021 來進(jìn)行打字的工作，而更習(xí)慣在專門的文本編輯軟件中快速打字，如 Microsoft Word 和 Windows 自帶的記事本等，又或者讀者已經(jīng)準(zhǔn)備好了要放入網(wǎng)頁的文本的電子版本，那么我們就可以直接使用 Dreamweaver 的文本復(fù)制功能，將大段的文本內(nèi)容拷貝到網(wǎng)頁的編輯窗口來進(jìn)行排版的工作，具體步驟如下。 打開文本編輯軟件（如 Microsoft Word），選中要復(fù)制的文本，它們將反白顯示，執(zhí)行菜單“編輯 /復(fù)制”命令或直接用快捷鍵 Ctrl+C，之后切換回 Dreamweaver,將光標(biāo)停留在插入文本的位置，執(zhí)行主菜單“編輯 /粘貼”命令或直接使用快捷鍵 Ctrl+v,即可將大段的文本快速粘貼到網(wǎng)頁中。 這在我的“網(wǎng)文精品”中用到很多，全部是在 word 軟件中排好 ctrl+c,然后點(diǎn)擊要粘貼的位置， crtl+v 到 Dreamweaver 即可。 還有其它的幾個網(wǎng)站與主頁的制作相同，一個網(wǎng)頁是圖象和文字的組合。 “平面設(shè)計”中的圖象插入和前面的介紹相似，并可以在屬性攔中調(diào)節(jié)圖象的大小。 在 Dreamwerver 中常常會用到 Firework、 Flash，它們是相輔相成，在主頁中的主體部分就是用 Firework,如圖所示： 在“個人說明”中也用到這點(diǎn)，首先定好需要尺寸，在屬性中設(shè)好背景，顏色等等，插入圖象，輸入文字，也 word 里的操作雷同。 第三章 建立網(wǎng)頁鏈接 網(wǎng)站實(shí)際上是由很多網(wǎng)頁組成的，那么網(wǎng)頁之間是如何聯(lián)系的呢？這就是本章要講的內(nèi)容 網(wǎng)頁的“鏈接”。 “鏈接”，又稱“超鏈接 （ Hyperlink） ,它作為網(wǎng)頁的橋梁，起著相當(dāng)重要的作用。網(wǎng)頁中的很多對象都可以加入 “鏈接”屬性。在 Dreamweaver MX2021 中，如果以“鏈接”的媒介來劃分的話，則“鏈接”可以分為“文字鏈接”、“圖像鏈接”、“圖像地圖鏈接”、“內(nèi)部鏈接和外部鏈接”、“ Email 鏈接”、“命名錨記鏈接”、“文件下載鏈接”和“跳轉(zhuǎn)菜單”，共 8 種。其中部分內(nèi)容在之前的章節(jié)中可能接觸過，這里將對其進(jìn)行更深入的講解。 文字鏈接 “文字鏈接”即以文字作為媒介的鏈接，它是網(wǎng)頁中最常被使用的鏈接方式，具有“文件小、制作簡單和便于維護(hù)”的特點(diǎn)。 接下來結(jié)合我的個人網(wǎng)站為實(shí)例，來講解如何為文字建立“鏈接 ”。 具體操作步驟如下所述。 操作步驟 步驟 1 準(zhǔn)備好已經(jīng)制作完成的首頁的各個欄目頁面（假設(shè)除了“鏈接”，其他內(nèi)容都已經(jīng)制作完成了），該網(wǎng)站包含 6個欄目，這里的 5個欄目 “平面設(shè)計”、“動畫制作”和“網(wǎng)文精品”、“經(jīng)典回顧”、“個人說明”為例來進(jìn)行講解。 步驟 2 在 Dreamweaver 中打開首頁，之后反白選取作為“鏈接”的文字。實(shí)例中要做到單擊不同的欄目的網(wǎng)頁。因此為第 1個欄目“平面設(shè)計”設(shè)置鏈接，首先要反白選中“平面設(shè)計” 4個文字。 步驟 3 觀察“屬性面板”，其中包括一個“鏈接”文本框。 步驟 4 接下來需要把鏈接的地址加入到文本框中，方法有 3 種。 這里我用到的是直接點(diǎn)擊文件夾圖標(biāo)，在文件夾中找到要鏈接的對象 。這樣就建立了超鏈接。不過有點(diǎn)很重要，由于大多數(shù)服務(wù)器都不支持中文文件名，而且對大小寫敏感，因此采用英文文件名并統(tǒng)一大小寫。如圖所示： 步驟 5 在“鏈接”文本框下面還有一個“目標(biāo)”下拉列表，從中可以選擇鏈接網(wǎng)頁顯示的窗口方式，共有 4種。如圖： 實(shí)例中沒有選擇任何選項(xiàng)，保持空白，表示在原窗口中打開鏈接網(wǎng)頁。 步驟 6 還可以設(shè)置一些“鏈接”的屬性，這是前面講過的內(nèi)容。單擊“屬 性面板”中的“頁面屬性”，選擇其中的“鏈接”分類，可以進(jìn)行的設(shè)置有“鏈接字體”、“大小”、“鏈接顏色”、“變換圖像鏈接”顏色、“已訪問鏈接”顏色、“活動鏈接”顏色及“下劃線樣式”。 步驟 7 至此，第 1個欄目的鏈接就制作完畢了，按下 Ctrl+S 保存網(wǎng)頁，再按下 F12 預(yù)覽，測試一下，當(dāng)鼠標(biāo)放在“平面設(shè)計”這 4 個文字上時將變成手形，并且瀏覽器窗口下面的狀態(tài)欄中會顯示鏈接到的網(wǎng)頁的地址，單擊文字，頁面會立即跳轉(zhuǎn)到第 1個欄目中，這表示鏈接已經(jīng)制作成功了。 步驟 8 同理，按照以上步驟，再為“動畫制作”和“網(wǎng)文精品”“ 經(jīng)典回顧“等其它欄制作指向?qū)?yīng)欄目的鏈接。 步驟 9 通常在欄目頁面中還需要有“返回首頁”的鏈接，單擊其后可以跳轉(zhuǎn)回首頁，因此在各個欄目中還要插入“網(wǎng)站首頁”的文字，并且制作指向首頁 的鏈接，制作方法不變。 至此，整個“文字鏈接”的實(shí)例就全就全部完成了。通過對這個實(shí)例的講解，讀者不僅應(yīng)該學(xué)會如何為文字制作鏈接，還應(yīng)用對“鏈接”有了更加深刻的理解，鏈接的目的何在？它到底能夠在網(wǎng)頁的網(wǎng)站中發(fā)揮什么樣的作用？怎樣才能更好地使用它？這些是網(wǎng)頁制作者更應(yīng)該思考的問題。 下面繼續(xù)介紹其他類型的鏈接。 “圖像”也是常被使用的鏈接媒體，它和“文字鏈接”非常相似。為圖像加入鏈接，首先應(yīng)該在網(wǎng)頁中插入“圖像”，有關(guān)插入“圖像”或“導(dǎo)航條”按鈕的內(nèi)容，接下來以我的網(wǎng)站“追夢人“為例，講解如何建立“圖像鏈接”。 操作步驟 步驟 1 首先仍然要準(zhǔn)備好已經(jīng)制作完成的首頁和各個欄目的頁面（假設(shè)除了“鏈接”，其他內(nèi)容都已經(jīng)制作完成了），該網(wǎng)站包含 6 個欄目，下面我們就動手為這 6個欄目分別制作它們的鏈接。 步驟 2 在 Dreamweaver 中打開網(wǎng)站的首頁，之后選取要制作“鏈接”的圖像。實(shí)例中先為第 3個欄目“動畫 制作”設(shè)置鏈接，因此選中包含“動畫制作” 4個字的圖像。 步驟 3 觀察“屬性面板”，在“鏈接”文本框中輸入鏈接的文字地址?？梢允褂弥爸v過的“指向文件”和“選擇文件”的方法。 步驟 4 如果有需要，可以在“目標(biāo)”下拉列表中選擇“鏈接”網(wǎng)頁顯示的窗口方式，分別為 blank 、 parent 、 self 或 top。實(shí)例中使用了默認(rèn)出的保留空白選項(xiàng)的方式。 步驟 5 另外，讀者還可以為圖像增加“替代”文本。實(shí)例中為第 1個欄目增加欄目名稱的“替代”文本。 步驟 6 至此，第 1個欄目的圖像鏈接就制作完畢了，按下 Ctrl+S 保存網(wǎng)頁，再按下 F12預(yù)覽，測試一下，將鼠標(biāo)放在“動畫制作” 4個文字上時將變成手形，同時瀏覽器窗口下面的狀態(tài)欄中會顯示出鏈接到的網(wǎng)頁的地址，并且會顯示出“替代”文本“動畫制作”，單擊文字，頁面會立即跳轉(zhuǎn)到第 3 個欄目中，這表示鏈接已經(jīng)制作成功了。 步驟 7 同理，按照以上步驟，再為其它幾幅圖像制作指向?qū)?yīng)欄目的鏈接。 步驟 8 在欄目頁面中制作“返回首頁”的鏈接，使得單擊后可以跳轉(zhuǎn)回首頁，其制作方法不變。 至此，整個“圖像鏈像”的實(shí)例就全部完成了。 – Mail 的鏈接 EMail 鏈接，是指當(dāng)瀏覽 者單擊該鏈接之后，不是打開一個網(wǎng)頁文件，而是啟動用戶的E Mail 客戶端軟件（如 Outlook Express） ,并打開一個空白的新郵件，供瀏覽者撰寫內(nèi)容來與網(wǎng)站聯(lián)系人聯(lián)系，這是一種最方便的互動方式。 結(jié)合“個人說明”網(wǎng)頁，建立 EMail 鏈接的步驟如下所述。 操作步驟 步驟 1 將光標(biāo)停留在頁面右下角要插入 Email 鏈接的位置。 步驟 2 選擇“插入快捷欄”中的“常用”分類，單擊左側(cè)第 2 個“電子郵件鏈接”按鈕。 步驟 3 在彈出的“電子郵件鏈接”對話框中有兩個輸入項(xiàng)，分別是“文本”和“ EMail” 。在 “文本”項(xiàng)中輸入鏈接的文字，中文、英文均可，在 EMail 項(xiàng)中輸入網(wǎng)站聯(lián)系有的電子郵件地址，如實(shí)例中的 。 步驟 4 單擊“確定”按鈕，具有“ EMail 鏈接”屬性的文本就 ding_zhuimeng123@163.。插入到光標(biāo)所在位置了，按下 Ctrl+S 保存網(wǎng)頁， 再按下 F12 預(yù)覽查看實(shí)際效果。 上面的方法只適用于文本的“ EMail 鏈接”，如果想在其它的對象（如圖像）上也加入這種鏈接，該怎辦呢？下面介紹第 2 種建立“ EMail 鏈接”的方法。 其實(shí)很簡單，與前面講過的圖像加入鏈接的方法基本一樣。先在頁面中需要的地方插入圖像，之后選中圖像，并在“屬性面板”的“鏈接”文本框中輸入如下語句即可 mailto: ?subject=網(wǎng)站的建議與第 1 種方法不同的是， EMail 地址前面增加了 mailto:字樣。用這種方法就可以給圖像等其他對象建立“ EMail鏈接”了。 “文件下載鏈接”的原理很簡單，只要鏈接文件屬于瀏覽無法識別的關(guān)型，便都會使用IE瀏覽器直接進(jìn)行下載，并保存到本地計算機(jī)中。 瀏覽器無法識別的文件類型有很多，這里就介紹一個最常用的，以 zip 或 rar為后綴名的壓縮格式文件，這種文件可以使用主流的壓縮軟件（如 winzip、 winrar）來制作。下面我們就業(yè)以實(shí)例來說明。 在前面“插入多媒體”一章 中，我們曾經(jīng)講過直接鏈接文件的方式來插入“視頻”，即直接在“鏈接”文本框中輸入“文件名 +名后綴名”，如 。單日擊這個鏈接，經(jīng)過數(shù)據(jù)下載后， Windows 系統(tǒng)將啟動自帶的媒體播放器 Windows Media Player 來播放該視頻。 操作步驟 步驟 1 先將視頻文件 通壓縮成 文件，放入站點(diǎn)的 media 文件夾下。 步驟 2 將文件路徑輸入至“鏈接”文本框中。 步驟 3 保存網(wǎng)頁，按下 F12 預(yù)覽，在瀏覽器中單擊“下載精彩廣告視頻”鏈接文本，會彈出“文本下 載”選擇框，單擊其中的“保存”按鈕。 步驟 4 在“另存為”對框中選擇保存到本地計算機(jī)中的位置，實(shí)例中為“經(jīng)典回顧”文件夾。之后單擊“保存”按鈕，壓縮文件即保存到該位置中。至此，“文件下載鏈接”便制作完成了。讀者可以打開“我的文檔”文件夾，解壓縮 文件，隨時欣賞下載影片。 本設(shè)計中未用到此鏈接，在此只作簡單介紹。 HTML 語言中建立網(wǎng)頁鏈接 文字鏈接 在 HTML 語言中用超鏈接標(biāo)記指向一個目標(biāo)。其基本格式為： a href=” URL”文本內(nèi)容 /a 舉個簡單的 “文本鏈接”的實(shí)例，該實(shí)例相對應(yīng)的 HTML 代碼如下所示。 html head title文字鏈接 /title /head body pa href“ ” target=” blank” 平面設(shè)計 /a（新開窗口， blank)/p pa href=” 動畫制作 /a（原窗口，默認(rèn)為空） /p pa href=” 網(wǎng)文精品 /a/p /body /html 解釋 171。 href:是 a標(biāo)記的一種屬性，該屬性中的 URL 等于鏈接目標(biāo)文件的地址。 171。 Target:也是 a標(biāo)記的一種屬性，相當(dāng)于 Dreamweaver“屬性面板”中的“目標(biāo)”，它的值等于 blank,效果是在新窗口中打開。除此之外還包括其他 3種： parent,self和 top。這和 Dreamweaver 中“目標(biāo)”下拉列表中的內(nèi)容是一模一樣的。 171。 文本內(nèi)容：如代碼實(shí)例中的“平面設(shè)計”。這些文本將放在使用了鏈接屬性 href和目標(biāo)屬性 target 的 a與 /a標(biāo)記之間，產(chǎn)生了鏈接的效果。 提示 再提醒讀者一下， p為段落標(biāo)記，在 Dreamweaver 中是由 Enter（回車）鍵產(chǎn)生的。 圖像鏈接 舉個簡單的“圖像鏈接”的實(shí)例。該實(shí)例相對應(yīng)的ＨＴＭＬ代碼所示。 html head title圖像鏈接 /title /head body pa href=” web/” target=” blank” img src=” images/btn001ou” alt“平面設(shè)計” =width=” 85” height=” 18” border=” 0” /a（新開窗口，blank） /p pa href=wallpaper/” img src=” images/”alt=“原創(chuàng)壁紙” width=” 85” height=” 18” border=” 0” /a（原窗口，默認(rèn)為空）/p pa href=” 3d/” img src=” images/” alt“三維作品”=width=” 85” height=” 18” border=” 0” /a/p /body /html 解釋仔細(xì)觀察代碼可以發(fā)現(xiàn)，“圖像鏈接”與“文本鏈接”惟一的差別就在于 a與 a/之間的內(nèi)容?！拔谋炬溄印敝?a與 /a之間的內(nèi)容是文字內(nèi)容，而“圖像鏈接”中就肯定是圖片內(nèi)容了。之前講過，插入圖片使用“ img src=”圖像的ＵＲＬ“ ”的標(biāo)記，這里當(dāng)然也不會例外。而是還可以使用” img 的屬性，如 alt（替換文本）、 width（寬）、height（高）、及 border（邊框）等 －Ｍ ail鏈接 該實(shí)例相對應(yīng)的“ＨＴＭＬ”代 碼如下所述。 html head titleEmail 鏈接 /title /head body pa href=” mailto:?subject=網(wǎng)站的意見建議“ 給我寫信 /a/p /body html 解釋 只需使 href 等于“ mailto：郵件地址？ subject=主題＂即可，其中