第3章網(wǎng)頁(yè)的基礎(chǔ)操作2/6/20231《網(wǎng)頁(yè)設(shè)計(jì)技術(shù)》內(nèi)容3.1設(shè)置網(wǎng)頁(yè)屬性3.2添加網(wǎng)頁(yè)內(nèi)容為網(wǎng)頁(yè)加入添加文本給網(wǎng)頁(yè)加入圖像插入多媒體對(duì)象超鏈接的使用2/6/20232《網(wǎng)頁(yè)設(shè)計(jì)技術(shù)》設(shè)置網(wǎng)頁(yè)屬性制作網(wǎng)頁(yè)時(shí)，先需設(shè)置網(wǎng)頁(yè)的頁(yè)面屬性，如網(wǎng)頁(yè)標(biāo)題、背景圖像、超鏈接的顏色、文檔編碼方式等屬性?！靶薷摹保绊?yè)面屬性”命令，將打開“頁(yè)面屬性”對(duì)話框，各選項(xiàng)的含義：外觀：用來(lái)設(shè)置頁(yè)面的默認(rèn)字體、背景顏色、背景圖像、頁(yè)面邊距等鏈接：設(shè)置鏈接字符的字體、顏色等標(biāo)題：設(shè)置當(dāng)前網(wǎng)頁(yè)文本的格式標(biāo)題和編碼：“標(biāo)題”設(shè)置網(wǎng)頁(yè)文檔的標(biāo)題；“編碼”設(shè)置文檔字體采用的編碼方式。計(jì)算機(jī)中顯示的每種文字都需要對(duì)應(yīng)的編碼支持，才能正常顯示，否則出現(xiàn)亂碼，在中文模式下默認(rèn)編碼為簡(jiǎn)體中文GB2312。跟蹤圖像：在設(shè)計(jì)頁(yè)面時(shí)插入用作參考的圖像文件，瀏覽網(wǎng)頁(yè)時(shí)該圖片是看不到的。3.1設(shè)置網(wǎng)頁(yè)屬性2/6/20233《網(wǎng)頁(yè)設(shè)計(jì)技術(shù)》3.2添加網(wǎng)頁(yè)內(nèi)容插入文本普通文本特殊文本在字符之間添加空格水平線日期格式化文本項(xiàng)目列表

3.2.1為網(wǎng)頁(yè)加入文本2/6/20234《網(wǎng)頁(yè)設(shè)計(jì)技術(shù)》1.普通文本的錄入直接輸入文本復(fù)制文本。在其他文本編輯器中復(fù)制文本（如Word），在DW中執(zhí)行粘貼命令即可。但DW不保留原有的文本格式。如果想保留文本的格式，可以選擇[編輯][選擇性粘貼]菜單命令插入Word或Excel等其它文檔的內(nèi)容。選擇[文件][導(dǎo)入]

菜單命令。特殊文本。

“插入”欄中的“文本”，則彈出文本工具欄，單擊字符按鈕，單擊相應(yīng)的特殊字符。如果沒有使用西歐字符，則會(huì)彈出一個(gè)警告框，提示可能有些瀏覽器不能正常顯示這些字符。3.2添加網(wǎng)頁(yè)內(nèi)容2/6/20235《網(wǎng)頁(yè)設(shè)計(jì)技術(shù)》在字符之間添加多個(gè)空格在“插入”欄的“文本”選項(xiàng)卡中，單擊“字符”按鈕，選擇“插入不換行空格”

[插入][HTML][特殊字符][不換行空格]

按【Ctrl+Shift+空格鍵】鍵輸入。設(shè)置添加不換行空格的參數(shù)。通過(guò)[編輯][首選參數(shù)]菜單命令去設(shè)置。水平線：在“插入”欄的“HTML”選項(xiàng)中單擊“水平線”按鈕。插入關(guān)鍵字：關(guān)鍵字為網(wǎng)絡(luò)中的搜索引擎準(zhǔn)備的，關(guān)鍵字要求簡(jiǎn)短、盡可能概括網(wǎng)頁(yè)的主題，以便瀏覽者在輸入很少關(guān)鍵字的情況下，就能很大程序地搜索到網(wǎng)頁(yè)。通過(guò)“插入”“HTML”“文件頭標(biāo)簽”“關(guān)鍵字”即可，各關(guān)鍵字用逗號(hào)分隔。日期：在“插入”欄的“常用”選項(xiàng)中，單擊“插入日期”按鈕。3.2添加網(wǎng)頁(yè)內(nèi)容2/6/20236《網(wǎng)頁(yè)設(shè)計(jì)技術(shù)》2.普通文本的格式化一般有屬性面板和菜單命令兩種方法使用菜單命令時(shí)，只需要選擇“文本”菜單下的相應(yīng)命令即可。最常用的屬性面板,

文本屬性面板中各選項(xiàng)含義及設(shè)置方法如下。

格式：設(shè)置選定文本的段落格式。如段落、標(biāo)題1、標(biāo)題2等；樣式：對(duì)選定內(nèi)容應(yīng)用文本樣式CSS樣式

；粗體、斜體、大小、顏色、對(duì)齊方式鏈接：除了上述的字符格式化外，還可以對(duì)所選的文本建立超級(jí)鏈接；目標(biāo)：在此設(shè)置打開超級(jí)鏈接的窗口；字體3.2添加網(wǎng)頁(yè)內(nèi)容2/6/20237《網(wǎng)頁(yè)設(shè)計(jì)技術(shù)》字體屬性說(shuō)明：默認(rèn)情況下，DW提供了三種中文字體，如果要使用其它中文字體，可用“編輯字體列表”命令將系統(tǒng)的字體添加到DW字體列表中。字體列表中每一選項(xiàng)中包括多種字體，各種字體之間用“，”分隔。其含義是瀏覽者的瀏覽器中如果沒有這種字體，則用“，”后面的字體進(jìn)行顯示，以此類推。3.2添加網(wǎng)頁(yè)內(nèi)容2/6/20238《網(wǎng)頁(yè)設(shè)計(jì)技術(shù)》3.項(xiàng)目列表和編號(hào)列表編號(hào)列表：對(duì)于具有序列屬性（即順序性）、屬性相同的內(nèi)容，則可設(shè)置編號(hào)列表。單擊屬性面板中的“編號(hào)列表”按鈕選擇[文本][列表][編號(hào)列表]菜單命令。項(xiàng)目列表：對(duì)于一些具有相同或相似屬性的文本，將內(nèi)容條列成項(xiàng)目，以便組成一個(gè)整體項(xiàng)目分類。定義列表：不使用項(xiàng)目符號(hào)點(diǎn)或數(shù)字這樣的前導(dǎo)字符，并且通常用于詞匯表或說(shuō)明

嵌套列表：包含其它列表的列表。屬性面板中的“縮進(jìn)”按鈕，或選擇[文本][縮進(jìn)]菜單命令來(lái)實(shí)現(xiàn)。列表屬性設(shè)置

默認(rèn)的前導(dǎo)符為一個(gè)點(diǎn)或阿拉伯?dāng)?shù)字，如要改成其他前導(dǎo)字符，通過(guò)“列表屬性”對(duì)話框。3.2添加網(wǎng)頁(yè)內(nèi)容2/6/20239《網(wǎng)頁(yè)設(shè)計(jì)技術(shù)》3.2.2為網(wǎng)頁(yè)加入圖像1.圖像的格式

由于受網(wǎng)絡(luò)速度等方面的影響，一般用于網(wǎng)頁(yè)的圖像：GIF、JPEG或PNG，適合網(wǎng)頁(yè)快速下載瀏覽。GIF壓縮格式：無(wú)損壓縮格式，只能支持256種顏色，適合對(duì)顏色數(shù)目要求不高的卡通畫及程序界面等。GIF格式還可設(shè)置為透明及制作成動(dòng)畫文件。JPEG即JPG：為有損壓縮格式，支持24位真彩色，最初為照片而設(shè)計(jì)。很高壓縮比，刪除人眼不易察覺的部分圖像，適合表現(xiàn)顏色豐富、色彩過(guò)渡平滑的圖像，不支持透明和動(dòng)畫。PNG：無(wú)損壓縮格式，支持24位真彩色，F(xiàn)IREWORKS的文件格式。有較大的靈活性并且文件大小較小。3.2添加網(wǎng)頁(yè)內(nèi)容2/6/202310《網(wǎng)頁(yè)設(shè)計(jì)技術(shù)》2.圖像的插入

網(wǎng)頁(yè)一般是圖文混排結(jié)構(gòu)，除了添加文本內(nèi)容，還需要插入有說(shuō)服力的資料圖片。直接插入圖像：可使用[插入][圖像]菜單命令或“插入欄”的“常用”選項(xiàng)卡中的“圖像”按鈕。用占位符插入圖像：在制作網(wǎng)頁(yè)時(shí)，經(jīng)常會(huì)出現(xiàn)所需的圖像還沒有制作完成的情況，此時(shí)先插入一個(gè)圖像占位符。圖像占位符是一個(gè)占有一定空間的符號(hào)，能替換為其他真實(shí)的圖像，它不會(huì)在瀏覽器中顯示。[插入][圖像對(duì)象][圖像占位符]注意：與添加文本不同，插入的圖像不能從別的文檔中復(fù)制，插入到網(wǎng)頁(yè)中的圖像只能以文件的形式獨(dú)立存在于站點(diǎn)文件夾中。如果圖像文件不在站點(diǎn)目錄中，DW會(huì)保存到站點(diǎn)目錄中。3.2添加網(wǎng)頁(yè)內(nèi)容2/6/202311《網(wǎng)頁(yè)設(shè)計(jì)技術(shù)》圖像的屬性說(shuō)明源文件：圖像文件所在的目錄及名稱，可通過(guò)“指向文件”或“瀏覽”按鈕設(shè)置。替代：為圖片添加描述信息。在瀏覽器中，當(dāng)鼠標(biāo)指向圖像時(shí)會(huì)顯示這個(gè)描述信息。鏈接：為圖像指定一個(gè)鏈接。編輯：?jiǎn)?dòng)“外部編輯器”，同時(shí)打開所選圖像進(jìn)行編輯。垂直/水平邊距：圖像相對(duì)于編輯窗口或文本等的間隔。低解析度源：設(shè)置低分辯率的圖像。在主圖像被下載之前，先載入低分辯率圖像，以便瀏覽者及早地了解圖像的信息。啟動(dòng)Firework優(yōu)化當(dāng)前圖像對(duì)當(dāng)前圖像進(jìn)行裁剪操作，去掉不需要的部分調(diào)整圖像的對(duì)比度和亮度2/6/202312《網(wǎng)頁(yè)設(shè)計(jì)技術(shù)》圖像的屬性說(shuō)明地圖：通過(guò)在一幅圖像上選擇局部范圍（熱點(diǎn)）來(lái)實(shí)現(xiàn)超鏈接，被選擇并被標(biāo)注的地方就叫圖像地圖。選取圖片，屬性面板中將出現(xiàn)4個(gè)熱點(diǎn)工具。4個(gè)熱點(diǎn)工具的作用如下： ：指針熱點(diǎn)工具，用于移動(dòng)、放大或縮小熱區(qū)。 ：矩形熱點(diǎn)工具，用于繪制矩形熱區(qū)。 ：橢圓形熱點(diǎn)工具，用于繪制圓形熱區(qū)。 ：多邊形熱點(diǎn)工具，用于繪制多邊形熱區(qū)。返回2/6/202313《網(wǎng)頁(yè)設(shè)計(jì)技術(shù)》“圖像占位符”的具體設(shè)置“名稱”（可選）：圖像占位符標(biāo)簽顯示的文本?！皩挾取焙汀案叨取保涸O(shè)置圖像大小，這是必需的。“顏色”（可選）“替換文本”（可選）：設(shè)置描述該圖像的文本。在瀏覽器中預(yù)覽圖片，當(dāng)鼠標(biāo)移到用占位符添加的圖像上時(shí)替代文本就會(huì)出現(xiàn)。雙擊占位符打開“選擇圖像源文件”對(duì)話框，指定好要插入的圖像文件即可返回2/6/202314《網(wǎng)頁(yè)設(shè)計(jì)技術(shù)》3.創(chuàng)建鼠標(biāo)經(jīng)過(guò)圖像（翻轉(zhuǎn)圖像）鼠標(biāo)經(jīng)過(guò)圖像是一種在瀏覽器中查看并使用鼠標(biāo)指針移過(guò)它時(shí)發(fā)生變化的圖像。必須用兩個(gè)圖像來(lái)創(chuàng)建鼠標(biāo)經(jīng)過(guò)圖像：主圖像（首次加載頁(yè)面時(shí)顯示的圖像）和次圖像（鼠標(biāo)指針移過(guò)主圖像時(shí)顯示的圖像）。鼠標(biāo)經(jīng)過(guò)圖像中的這兩個(gè)圖像應(yīng)大小相等；如果這兩個(gè)圖像大小不同，DW將調(diào)整第二個(gè)圖像的大小與第一個(gè)圖像的尺寸相匹配。“插入”“圖像對(duì)象”“鼠標(biāo)經(jīng)過(guò)圖像”。鼠標(biāo)經(jīng)過(guò)圖像與FLASH按鈕、FLASH文本一般都用于制作超鏈接。3.2添加網(wǎng)頁(yè)內(nèi)容2/6/202315《網(wǎng)頁(yè)設(shè)計(jì)技術(shù)》3.2.3插入多媒體對(duì)象

當(dāng)前網(wǎng)頁(yè)中多媒體包括：動(dòng)畫、音頻、視頻等元素。DW可有效地將多媒體元素和其它元素有機(jī)地整合在一起，以豐富網(wǎng)頁(yè)的內(nèi)容。Flash文件的格式：源文件(.fla)、影片文件(.swf)、模板文件(.swt)、視頻文件(.flv)等；音頻文件格式：midi或mid、wav、aif、mp3、ra、ram、rpm及RealAudio等。播放wav、aif和midi文件不需要插件；視頻文件格式：AVI、WMV、RM等，視頻格式不同，對(duì)應(yīng)的播放器是有區(qū)別的。雖然它們播放器不同，但它們一般都是使用ActiveX控件或插件來(lái)播放。3.2添加網(wǎng)頁(yè)內(nèi)容2/6/202316《網(wǎng)頁(yè)設(shè)計(jì)技術(shù)》1插入Flash內(nèi)容插入Flash動(dòng)畫（影片文件.swf）“常用”“媒體”按鈕，選擇“Flash”選項(xiàng)；或執(zhí)行[插入][媒體][Flash]菜單命令對(duì)話框?qū)傩哉f(shuō)明：

標(biāo)題：媒體對(duì)象的標(biāo)題。

快捷鍵：輸入A作為快捷鍵，則使用“Ctrl+A”鍵在瀏覽器中選擇該對(duì)象。

Tab鍵索引：輸入一個(gè)數(shù)字以指定該對(duì)象的Tab鍵順序。注意：IE為了保護(hù)電腦的安全性，阻止了ActiveX。如何去掉這種阻止，微軟提供了一種非常簡(jiǎn)便的方法，在網(wǎng)頁(yè)的頭部添加如下代碼：<!--savedfromurl=(0013)about:internet-->3.2添加網(wǎng)頁(yè)內(nèi)容2/6/202317《網(wǎng)頁(yè)設(shè)計(jì)技術(shù)》插入Flash按鈕

DW提供了許多Flash動(dòng)畫按鈕，也可以插入自已制作的Flash按鈕，方法與插入Flash影片類似。樣式：選擇按鈕的樣式按鈕文本：按鈕上顯示的文本鏈接：按鈕鏈接的地址另存為：設(shè)置按鈕的保存名稱注意：此功能不支持中文名稱。按鈕保存的文檔文件和站點(diǎn)文件夾的名稱都不能為中文，否則不能正常使用按鈕。3.2添加網(wǎng)頁(yè)內(nèi)容2/6/202318《網(wǎng)頁(yè)設(shè)計(jì)技術(shù)》插入Flash文本

Flash文本對(duì)象允許DW創(chuàng)建一個(gè)僅包含文本的Flash影片文件。插入Flash文本時(shí)，保存Flash的路徑對(duì)話框中的“另存為”不能出現(xiàn)中文，路徑不能太長(zhǎng)，并且要與當(dāng)前的文檔在一個(gè)文件夾里面。Flash文本具有與鼠標(biāo)經(jīng)過(guò)圖象類似的效果，主要用于設(shè)置超級(jí)鏈接。插入FlashVideo（FLV格式）

在網(wǎng)頁(yè)中瀏覽Flash視頻時(shí)不僅顯示該視頻信息，還將顯示播放該視頻的控件。3.2添加網(wǎng)頁(yè)內(nèi)容2/6/202319《網(wǎng)頁(yè)設(shè)計(jì)技術(shù)》2.ActiveX控件事實(shí)上，瀏覽器僅僅能顯示幾種文件格式，ActiveX控件或插件擴(kuò)展了瀏覽器的能力。ActiveX控件是可充當(dāng)瀏覽器插件的可重復(fù)調(diào)用的組件，可在Windows操作系統(tǒng)上的IE瀏覽器中運(yùn)行。插入ActiveX控件后，在DW的文檔窗口會(huì)顯示一個(gè)占位符。在瀏覽器中，將出現(xiàn)了媒體播放器的界面，即可像平常使用播放器一樣來(lái)對(duì)它進(jìn)行控制，改變聲音等。3.2添加網(wǎng)頁(yè)內(nèi)容2/6/202320《網(wǎng)頁(yè)設(shè)計(jì)技術(shù)》ActiveX控件相關(guān)屬性如下嵌入：為ActiveX控件在<object>標(biāo)簽內(nèi)添加一個(gè)<embed>標(biāo)簽。如果ActiveX控件具有Netscape插件等效項(xiàng)，<embed>標(biāo)簽將激活該插件。源文件：如果“嵌入”項(xiàng)選中，則確定Netscape插件所使用的數(shù)據(jù)文件?；罚褐付ò揂ctiveX控件的URL。如果在瀏覽者系統(tǒng)中沒有該ActiveX控件，IE會(huì)從該位置下載該ActiveX控件。如果你沒有指定一個(gè)參數(shù)，而你的瀏覽者又沒有安裝相應(yīng)的ActiveX控件，瀏覽者無(wú)法顯示該ActiveX對(duì)象。替代圖像：如果游覽器不支持<object>標(biāo)簽，則指定顯示一幅圖像，該選項(xiàng)只在“嵌入”沒有選中下才可使用。數(shù)據(jù)：指定ActiveX控件下載的數(shù)據(jù)文件。許多ActiveX控件，不使用該參數(shù)，如shockwave、realplay3.2添加網(wǎng)頁(yè)內(nèi)容2/6/202321《網(wǎng)頁(yè)設(shè)計(jì)技術(shù)》3.利用插件添加視頻文件

插件是一種程序。瀏覽器一般能夠直接調(diào)用插件程序，插件安裝后就成為瀏覽器的一部分。通過(guò)插件可將視頻直接插入頁(yè)面中，但只有用戶在瀏覽網(wǎng)頁(yè)時(shí)具有所選視頻文件的適當(dāng)插件后，視頻才可以播放。典型的插件如RealPlayer和QuickTime。通過(guò)[插入][媒體][插件]菜單命令，選定視頻文件，即將插件插入到網(wǎng)頁(yè)中。在“插件URL”的文本框中可以輸入下載插件的完整URL。如果在瀏覽頁(yè)面時(shí)沒有該插件，則IE將從這里提供的URL上下載。插入插件之后，在瀏覽器中，將出現(xiàn)了媒體播放器的界面，即可象平常使用播放器一樣來(lái)對(duì)它進(jìn)行控制，改變聲音等。3.2添加網(wǎng)頁(yè)內(nèi)容2/6/202322《網(wǎng)頁(yè)設(shè)計(jì)技術(shù)》Shockwave是Macromedia公司制定的一種網(wǎng)上媒體交互壓縮格式的標(biāo)準(zhǔn)，其生成的壓縮格式可以被快速下載，并且被目前的主流瀏覽器所支持，其擴(kuò)展名：.dcr、dir、dxr。觀看Shockwave影片時(shí)，瀏覽器需安裝Shockwave播放器。JavaApplet是美國(guó)SUN公司開發(fā)的Java語(yǔ)言中的一個(gè)小應(yīng)用程序，具有跨平臺(tái)特點(diǎn)。JavaApplet可直接嵌入到HTML語(yǔ)言中，由支持Java的瀏覽器（IE或Netscape）解釋執(zhí)行，能夠產(chǎn)生特殊效果的程序。3.2添加網(wǎng)頁(yè)內(nèi)容2/6/202323《網(wǎng)頁(yè)設(shè)計(jì)技術(shù)》4.為網(wǎng)頁(yè)添加聲音以插件的形式向網(wǎng)頁(yè)添加聲音同插入其他插件的方法一樣，同樣以占位符的形式出現(xiàn)在網(wǎng)頁(yè)中。通過(guò)插件可將聲音直接插入頁(yè)面中，但只有用戶在瀏覽網(wǎng)頁(yè)時(shí)具有所選聲音文件的適當(dāng)插件后，聲音才可播放。在“插件URL”的文本框中可以輸入下載插件的完整URL。如果在瀏覽頁(yè)面時(shí)沒有該插件，則IE將從這里提供的URL上下載。在屬性面板中，將高度和寬度都設(shè)置為0，瀏覽器中將不會(huì)顯示播放器。3.2添加網(wǎng)頁(yè)內(nèi)容2/6/202324《網(wǎng)頁(yè)設(shè)計(jì)技術(shù)》在參數(shù)對(duì)話框編輯參數(shù)，實(shí)現(xiàn)循環(huán)和自動(dòng)播放，由此實(shí)現(xiàn)背景音樂的設(shè)置。單擊“參數(shù)”按鈕，打開對(duì)話框，如下圖所示。其實(shí)質(zhì)，在<body>和</body>之間的加入如下代碼

<embedsrc="media/Universe.mp3"hidden="true"autostart="true"loop="true"></embed>。

其中src指定音頻文件的路徑和文件名，hidden=true表示不顯示播放器，loop=true表示循環(huán)播放，autostart=true表示自動(dòng)播放。3.2添加網(wǎng)頁(yè)內(nèi)容2/6/202325《網(wǎng)頁(yè)設(shè)計(jì)技術(shù)》以背景音樂形式添加到網(wǎng)頁(yè)中在DW中，沒有背景音樂的具體設(shè)置。添加背景音樂有兩種方法，一種是通過(guò)手寫代碼或插件實(shí)現(xiàn)。將<bgsound>標(biāo)記加入到<head>和</head>之間。<bgsound>標(biāo)記是用來(lái)插入背景音樂的標(biāo)記，但只適用于IE。打開網(wǎng)頁(yè)文件，將網(wǎng)頁(yè)切換到代碼視圖，在<head>和</head>之間加入如下代碼：<bgsoundsrc="xxx.mp3"autostart="true"loop="-1">3.2添加網(wǎng)頁(yè)內(nèi)容2/6/202326《網(wǎng)頁(yè)設(shè)計(jì)技術(shù)》以鏈接的形式添加到網(wǎng)頁(yè)中鏈接音頻文件是將聲音添加到頁(yè)面的一種簡(jiǎn)單而有效的方法。這種方法可在單擊鏈接時(shí)自動(dòng)調(diào)用外部播放器來(lái)播放音樂文件。具體方法：在文檔窗口的設(shè)計(jì)視圖中，選擇要指向聲音文件的文本或圖像。在屬性面板的“鏈接”欄后，單擊瀏覽按鈕，鏈接到指定的聲音文件。3.2添加網(wǎng)頁(yè)內(nèi)容2/6/202327《網(wǎng)頁(yè)設(shè)計(jì)技術(shù)》3.2.4超鏈接1.超鏈接概述對(duì)于超鏈接來(lái)說(shuō)，路徑是一個(gè)重要的概念。常用的路徑有三種：絕對(duì)路徑：提供所鏈接文檔的完整URL，包括協(xié)議，服務(wù)器地址，路徑。

例如：/china/contents.html

通常用于站內(nèi)到站外的鏈接。如果是同一站點(diǎn)的文檔，使用絕對(duì)路徑會(huì)有弊端，因?yàn)樵谝苿?dòng)文件的時(shí)候，文件內(nèi)所有的絕對(duì)路徑都被打斷，造成鏈接錯(cuò)誤。3.2添加網(wǎng)頁(yè)內(nèi)容2/6/202328《網(wǎng)頁(yè)設(shè)計(jì)技術(shù)》文檔相對(duì)路徑：相對(duì)于當(dāng)前文檔而言，此路徑省略了與當(dāng)前文檔URL的相同部分，只提供了與其不同的部分。對(duì)于大多數(shù)的站內(nèi)鏈接，一般使用文檔相對(duì)路徑。如當(dāng)前文件與要鏈接的目標(biāo)文檔位于同一文件夾內(nèi)，只需輸入文件名即可。

例如：contents.html站點(diǎn)根目錄相對(duì)路徑：從站點(diǎn)的根文件夾到文檔的路徑，與當(dāng)前文檔無(wú)關(guān)。根目錄相對(duì)路徑由“/”開頭，它代表站點(diǎn)根文件夾。3.2添加網(wǎng)頁(yè)內(nèi)容2/6/202329《網(wǎng)頁(yè)設(shè)計(jì)技術(shù)》例如，假設(shè)一個(gè)站點(diǎn)的結(jié)構(gòu)如圖3.2添加網(wǎng)頁(yè)內(nèi)容resourcesproducts2/6/202330《網(wǎng)頁(yè)設(shè)計(jì)技術(shù)》創(chuàng)建從contents.html到其它文件的鏈接，如下：若要從contents.html

鏈接到hours.html。

文檔相對(duì)路徑：hours.html；若要鏈接到tips.html，在當(dāng)前文件夾下一級(jí)文件夾中。

文檔相對(duì)路徑：resources/tips.html；若要鏈接到index.html，站點(diǎn)根目錄中。

站點(diǎn)根目錄相對(duì)路徑：/index.html；若要鏈接到catalog.html，在站點(diǎn)根目錄下的products子文件夾中。

站點(diǎn)根目錄相對(duì)路徑：/products/catalog.html。3.2添加網(wǎng)頁(yè)內(nèi)容2/6/202331《網(wǎng)頁(yè)設(shè)計(jì)技術(shù)》鏈接的類型

根據(jù)鏈接的對(duì)象不同，分為文件鏈接、錨點(diǎn)鏈接、郵件鏈接、熱區(qū)鏈接、腳本和空鏈接

文件鏈接：鏈接到其它文檔或文件；錨點(diǎn)鏈接：跳轉(zhuǎn)到文檔內(nèi)的特定位置，可以是同一文檔中的錨記，也可以是其他文檔中的錨記；圖像地圖鏈接：指被分成多個(gè)區(qū)域（“熱點(diǎn)”）的圖像，而每個(gè)區(qū)域可設(shè)置鏈接；電子郵件鏈接：此類鏈接打開客戶端郵件應(yīng)用程序，并且新建一個(gè)已填好收件人地址的空白電子郵件；腳本鏈接：執(zhí)行腳本代碼或調(diào)用JavaScript函數(shù)。它非常有用，能夠在不離開當(dāng)前Web頁(yè)面情況下，當(dāng)訪問(wèn)者單擊特定項(xiàng)時(shí)，執(zhí)行計(jì)算、驗(yàn)證表單和完成其它處理任務(wù)等；空鏈接：是一個(gè)無(wú)指向的鏈接，用于向頁(yè)面上的對(duì)象或文本附加行為。3.2添加網(wǎng)頁(yè)內(nèi)容2/6/202332《網(wǎng)頁(yè)設(shè)計(jì)技術(shù)》鏈接文件的打開方式_blank——在新建窗口中加載鏈接文檔。_self——將鏈接文檔加載到與鏈接相同的框架或窗口中，該目標(biāo)是默認(rèn)值。_parent——將鏈接的文件載入含有該鏈接框架的父框架集或上一級(jí)的瀏覽器窗口中。_top——將在最頂端的瀏覽器窗口中加載鏈接文件。如果當(dāng)前網(wǎng)頁(yè)是框架網(wǎng)頁(yè)，則刪除所有框架。Parent和top用于框架網(wǎng)頁(yè)。

3.2添加網(wǎng)頁(yè)內(nèi)容2/6/202333《網(wǎng)頁(yè)設(shè)計(jì)技術(shù)》2.錨點(diǎn)鏈接允許用戶在文檔的任何位置設(shè)置標(biāo)記（這些標(biāo)記通常放在文件特定主題的前面或頂部），然后為對(duì)象創(chuàng)建這些標(biāo)記的鏈接。錨點(diǎn)鏈接可以跳轉(zhuǎn)至當(dāng)前文檔或其它文檔內(nèi)的指定位置。建立錨點(diǎn)鏈接分為創(chuàng)建命名錨記和創(chuàng)建到該命名錨記的鏈接兩個(gè)步驟。

創(chuàng)建錨點(diǎn)：利用[常用]選項(xiàng)中[命名錨記]按鈕。

創(chuàng)建錨點(diǎn)的鏈接：選擇要?jiǎng)?chuàng)建錨點(diǎn)鏈接的對(duì)象，在屬性面板的“鏈接”文本框中，輸入一個(gè)數(shù)字符號(hào)“#”和錨記名稱，中間不能有空格。3.2添加網(wǎng)頁(yè)內(nèi)容2/6/202334《網(wǎng)頁(yè)設(shè)計(jì)技術(shù)》3.圖像地圖鏈接圖像作為一個(gè)整體，只能創(chuàng)建一個(gè)鏈接。如果要在一張圖像中建立多個(gè)鏈接，則用圖像地圖實(shí)現(xiàn)。圖像地圖指被分成多個(gè)區(qū)域（或稱“熱點(diǎn)”）的圖像，可為每個(gè)熱點(diǎn)指定一個(gè)鏈接。“屬性面板”中的4個(gè)“熱點(diǎn)工具”如下：

：指針熱點(diǎn)工具，用于移動(dòng)、放大或縮小熱區(qū)

：矩形熱點(diǎn)工具，用于繪制矩形熱區(qū)

：橢圓形熱點(diǎn)工具，用于繪制圓形熱區(qū)

：多邊形熱點(diǎn)工具，用于繪制多邊形熱區(qū)選取圖像→在“屬性面板”中單擊“熱點(diǎn)工具”并創(chuàng)建熱區(qū)→在“熱區(qū)”屬性面板中的“鏈接”文本框中創(chuàng)建鏈接。3.2添加網(wǎng)頁(yè)內(nèi)容2/6/202335《網(wǎng)頁(yè)設(shè)計(jì)技術(shù)》2/6/202336《網(wǎng)頁(yè)設(shè)計(jì)技術(shù)》2/6/202337《網(wǎng)頁(yè)設(shè)計(jì)技術(shù)》選擇一個(gè)熱區(qū)后，自動(dòng)打開“熱區(qū)”屬性面板，如圖所示。在屬性面板中進(jìn)行對(duì)應(yīng)的設(shè)置。在“鏈接”文本框中輸入要鏈接的文件名稱或相應(yīng)的錨點(diǎn)名稱。在“目標(biāo)”下拉列表框中選擇打開鏈接頁(yè)的方式。如圖所示，在新窗口中打開。在“替代”文本框中輸入鼠標(biāo)移動(dòng)到鏈接熱點(diǎn)上時(shí)顯示的內(nèi)容。2/6/202338《網(wǎng)頁(yè)設(shè)計(jì)技術(shù)》4.電子郵件鏈接

網(wǎng)頁(yè)中設(shè)置電子郵件鏈接非常普遍。當(dāng)單擊電子郵件鏈接文本時(shí)，該鏈接打開安裝在系統(tǒng)中的電子郵件應(yīng)用程序，并且創(chuàng)建了一個(gè)已指定好收件人地址的空白郵件。電子郵件鏈接創(chuàng)建方法如下：選擇[插入][電子郵件鏈接]菜單命令；在屬性面板的“鏈接”文本框中，輸入“mailto:”，在后輸入電子郵件地址。

如：mailto:lzj@

3.2添加網(wǎng)頁(yè)內(nèi)容2/6/202339《網(wǎng)頁(yè)設(shè)計(jì)技術(shù)》5.腳本鏈接

執(zhí)行腳本代碼或調(diào)用JavaScript函數(shù)。它非常有用，能夠在不離開當(dāng)前Web頁(yè)面的情況下為訪問(wèn)者提供有關(guān)某項(xiàng)的附加信息。腳本鏈接還可用于在訪問(wèn)者單擊特定項(xiàng)時(shí)，執(zhí)行計(jì)算、驗(yàn)證表單和完成其它處理任務(wù)。

在設(shè)計(jì)視圖中創(chuàng)建腳本鏈接在“文檔”窗口的“設(shè)計(jì)”視圖中選擇文本或圖像對(duì)象。在屬性檢查器的“鏈接”框中，鍵入javascript:后跟腳本代碼（在冒號(hào)與代碼或調(diào)用之間不能鍵入空格）。

如：javascript:window.close()

3.2添加網(wǎng)頁(yè)內(nèi)容2/6/202340《網(wǎng)頁(yè)設(shè)計(jì)技術(shù)》6.空鏈接

是未指派目標(biāo)的鏈接，空鏈接用于向頁(yè)面上的對(duì)象或文本附加行為。Dreamweaver行為面板中列出了許多行為，這些行為相當(dāng)于JAVASCRIPT的程序或函數(shù)，對(duì)文本設(shè)置行為先要設(shè)置空鏈接，行為才有效。

在設(shè)計(jì)視圖中創(chuàng)建空鏈接在“文檔”窗口的“設(shè)計(jì)”視圖中選擇文本、圖像或?qū)ο?。在屬性檢查器中的“鏈接”框中鍵入javascript:;（javascript

一詞后依次接一個(gè)冒號(hào)和一個(gè)分號(hào)，或直接輸入“#”字符）。3.2添加網(wǎng)頁(yè)內(nèi)容2/6/20234