網(wǎng)站鏈接的創(chuàng)建:
超鏈接是一種網(wǎng)站上常見的對象,它以特殊編碼的文本或圖形來實現(xiàn)鏈接。如果單擊該鏈接,則相當(dāng)于指示瀏覽器移至同一網(wǎng)站中的某個位置、打開一個新的網(wǎng)頁或打開某一個新的網(wǎng)站中的網(wǎng)頁。
一、網(wǎng)站鏈接概念
要正確地創(chuàng)建鏈接,就必須了解鏈接與被鏈接文檔之間的路徑,每一個網(wǎng)頁都有一個唯一的地址,稱為統(tǒng)一資源定位符(URL)。網(wǎng)站中的超鏈接按照鏈接路徑的不同,可以分為以下3種。
第 1種是絕對URL的超鏈接。URL(Uniform Resource Locator)就是統(tǒng)一資源定位符,簡單地講就是網(wǎng)絡(luò)上的一個站點或網(wǎng)站的完整路徑,如“http://www.guigusheji.com”。
第2種是相對URL的超鏈接。如將自己網(wǎng)站上的某一段文字或某標(biāo)題鏈接到同一網(wǎng)站的其他網(wǎng)頁上。
第3種稱為同一網(wǎng)站的超鏈接,這就是要使用到書簽的超鏈接,一般用“#”號加上名稱即可鏈接到同一頁面的指定地方。
二、課堂案例——圖像熱點鏈接
同一個圖像的不同部分可以鏈接到不同的文檔,這就是熱點鏈接。要使圖像特定部分成為超鏈接,就要在圖像中設(shè)置熱點,然后再創(chuàng)建鏈接。這樣當(dāng)鼠標(biāo)指針移動到圖像熱點的時候就會變成手的形狀,當(dāng)按下鼠標(biāo)的時候,頁面就會跳轉(zhuǎn)到或者打開鏈接的頁面。
下面創(chuàng)建圖像熱區(qū)鏈接。
最終案例效果文件所在位置:最終文件\CH01\1.7.2\index1.html
1 打開“原始文件\CH01\1.7.2\index.html”。
2 選中圖像images\index18.jpg,在【屬性】面板中選擇【矩形熱點】工具
。
提示
在【屬性】面板中有3種熱點工具,分別是【矩形熱點】工具、【圓形熱點】工具和【多邊形熱點】工具,可以根據(jù)圖像的形狀來選擇熱點工具。
3 將光標(biāo)置于圖像上要創(chuàng)建熱點的部分,按住鼠標(biāo)左鍵拖曳,繪制一個矩形熱點。在【屬性】面板中的【鏈接】文本框中輸入鏈接的地址shouye。
在熱點的【屬性】面板中的各參數(shù)設(shè)置如下。
鏈接:輸入相應(yīng)的鏈接地址。
替換:輸入說明文字。瀏覽網(wǎng)頁時,當(dāng)鼠標(biāo)指針移動到圖像熱點上就會顯示輸入的說明文字。
目標(biāo):選擇打開瀏覽器窗口的方式,不做選擇則默認(rèn)在瀏覽器窗口打開。
4 按照步驟2~3的方法繪制其他的熱點并創(chuàng)建鏈接
。
5 保存文檔。按F12鍵在瀏覽器中瀏覽效果。
三、課堂案例——E-mail鏈接
在網(wǎng)頁上單擊電子郵件鏈接時,將使計算機上的郵件程序打開一個新的空白郵件窗口,并在電子郵件消息窗口中的【收件人】一欄自動顯示電子郵件鏈接中指定的地址。
創(chuàng)建電子郵件超級鏈接的效果具體操作步驟如下。
最終案例效果文件所在位置:最終文件\CH01\1.7.3\index1.html
1 打開“原始文件\CH01\1.7.3\index.html”
2 將光標(biāo)置于要創(chuàng)建電子郵件鏈接的位置,選擇【插入】|【電子郵件鏈接】命令,彈出【電子郵件鏈接】對話框,在對話框中的【文本】文本框中輸入“聯(lián)系我們”,【電子郵件】文本框中輸入zhu@greatgoal-design.com。
3 單擊【確定】按鈕,創(chuàng)建電子郵件鏈接
.
4 保存文檔。按F12鍵在瀏覽器中瀏覽效果.
提示
創(chuàng)建電子郵件鏈接時,也可以在【屬性】面板中的【鏈接】文本框中輸入“mailto:郵件的名稱”,應(yīng)注意的是輸入郵件地址時一定不要省略“mailto:”。
四、課堂案例——下載文件鏈接
如果超級鏈接指向的不是一個網(wǎng)頁文件,而是其他文件(如zip、mp3或exe文件等),單擊超鏈接的時候就會下載文件。如果在網(wǎng)站中提供下載資料,就需要為文件提供下載鏈接。
下面創(chuàng)建下載文件超級鏈接具體操作步驟如下。
最終案例效果文件所在位置:最終文件\CH01\1.7.4\index1.html
1 打開“原始文件\CH01\1.7.4\index.html”,選中文字“更多”。
2 在【屬性】面板中單擊【鏈接】文本框右邊的【瀏覽文件】按鈕,彈出【選擇文件】對話框。在對話框中選擇要下載的文件“產(chǎn)品介紹.rar”。
3 單擊【確定】按鈕,創(chuàng)建下載文件超鏈接
。
4 保存文檔。按F12鍵在瀏覽器中瀏覽效果。
五、課堂案例——錨點鏈接
有時候網(wǎng)頁很長,為了找到其中的目標(biāo),不得不上下拖曳滾動條將整個文檔的內(nèi)容瀏覽一遍,這樣就浪費了很多時間。利用錨點鏈接能夠更精確地使訪問者快速瀏覽到選定的位置,加快信息檢索速度。
下面創(chuàng)建錨點鏈接具體操作步驟如下。
最終案例效果文件所在位置:最終文件\CH01\1.7.5\index1.html
1 打開“原始文件\CH01\1.7.5\index.html”
。
2 將光標(biāo)置于要插入錨點的位置,選擇【插入】|【命名錨記】命令,彈出【命名錨記】對話框。在對話框中的【錨記名稱】文本框中輸入a。
提示
錨記名稱只能包含小寫字母和數(shù)字,且不能以數(shù)字開頭。同一個網(wǎng)頁中可以有無數(shù)個錨記,但不能有相同的錨記名稱。
3 單擊【確定】按鈕,插入命名錨記。
4 選中文字“抗病原微生物類”,在【屬性】面板中的【鏈接】文本框中輸入“#a”
。
5 按照步驟2~4的方法插入錨記,【錨記名稱】文本框中分別輸入 b、c、d、e,并創(chuàng)建鏈接。
Copyright All Rights GreatGoal Design co.,ltd. 魯ICP備16002128號-3