HTML使用超鏈接與網(wǎng)絡(luò)上的另一個(gè)文檔相連但校。
幾乎可以在所有的網(wǎng)頁中找到鏈接。點(diǎn)擊鏈接可以從一張頁面跳轉(zhuǎn)到另一張頁面瞧省。
實(shí)例:
創(chuàng)建超級鏈接
本例演示如何在 HTML 文檔中創(chuàng)建鏈接峰伙。
將圖像作為鏈接
本例演示如何使用圖像作為鏈接。
HTML超鏈接(鏈接)
超鏈接可以是一個(gè)字署鸡,一個(gè)詞,一個(gè)詞組,也可以是一幅圖像靴庆,您可以點(diǎn)擊這些內(nèi)容來跳轉(zhuǎn)到新的文檔或者當(dāng)前文檔中的某個(gè)部分时捌。
當(dāng)您把鼠標(biāo)指針移動到網(wǎng)頁中的某個(gè)鏈接上時(shí),箭頭會變?yōu)橐恢恍∈帧?br>
通過使用<a>標(biāo)簽在HTML中創(chuàng)建鏈接炉抒。
有兩種使用<a>標(biāo)簽的方式:
1.通過使用herf屬性 - 創(chuàng)建指向另個(gè)文檔的鏈接
2.通過使用name屬性 - 創(chuàng)建文檔內(nèi)的書簽
HTML鏈接語法
鏈接HTML代碼很簡單奢讨,它類似這樣:
<a href="url">Link text</a>
href屬性規(guī)定鏈接的目標(biāo)。
開始標(biāo)簽和結(jié)束標(biāo)簽之間的文字被作為超鏈接來顯示焰薄。
實(shí)例:
<a href="http://www.reibang.com/u/6986e282f57b/">簡書InFatuated</a>
提示:"鏈接文本" 不必一定是文本拿诸。圖片或其他 HTML 元素都可以成為鏈接。
HTML鏈接 - target屬性
使用Target屬性塞茅,你可以定義被鏈接的文檔在何處顯示亩码。
下面的這行會在新窗口打開文檔:
<a href="http://www.reibang.com/u/6986e282f57b/" target="_blank">簡書InFatuated</a>
HTML鏈接 - name屬性
name屬性規(guī)定錨(anchor)的名稱。
您可以使用name屬性創(chuàng)建HTML頁面中的書簽野瘦。
書簽不會以任何特殊方式顯示描沟,他對讀者是不可見的。
當(dāng)使用命名錨(named anchors)時(shí)鞭光,我們可以創(chuàng)建直接調(diào)至該命名錨(比如頁面某個(gè)小節(jié)的鏈接)吏廉,這樣使用者就無需不停地滾動頁面來尋找他們需要的信息了。
命名錨的語法:
<a name="label">錨(顯示在頁面上的文本)</a>
提示:錨的名稱可以是任何你喜歡的名字惰许。
提示:您可以使用id屬性來替代name屬性席覆,命名錨同樣有效。
實(shí)例:
首先汹买,我們在HTML文檔里對錨進(jìn)行命名(創(chuàng)建一個(gè)書簽):
<a name="tips">基本注意事項(xiàng) - 有用的提示</a>
然后娜睛,我們在同一個(gè)文檔中創(chuàng)建指向錨的鏈接:
<a href="#tips">有用的提示</a>
您也可以在其他頁面中創(chuàng)建指向該錨的鏈接:
<a href="http://www.reibang.com/u/6986e282f57b/#tips">有用的提示</a>
在上面的代碼中,我們將#符號和錨名稱添加到URL的末端卦睹,就可以直接鏈接到tips這個(gè)命名錨了。
基本的注意事項(xiàng) - 有用的提示:
注釋:請始終將斜杠添加到子文件夾方库。假如這樣書寫鏈接herf="http://www.reibang.com/u/6986e282f57b",就會向服務(wù)器產(chǎn)生兩次HTTP請求结序。這是因?yàn)榉?wù)器會添加斜桿到這個(gè)地址,然后創(chuàng)建一個(gè)新的請求纵潦,就像這樣:href="http://www.reibang.com/u/6986e282f57b/"徐鹤。
提示:命名錨經(jīng)常用于大型文檔開始位置上創(chuàng)建目錄⊙悖可以為每一個(gè)章節(jié)賦予一個(gè)命名錨返敬,然后把鏈接到這些錨的鏈接放到文檔的上部。如果經(jīng)常訪問百度百科寥院,您就會發(fā)現(xiàn)其中幾乎每個(gè)詞條都采用這樣的導(dǎo)航方式劲赠。
提示:假如瀏覽器找不到已定義的命名錨,那么就會定位到文檔頂部。不會發(fā)生錯(cuò)誤凛澎。
更多實(shí)例
在新的瀏覽器窗口打開鏈接
本例演示如何在新窗口打開一個(gè)頁面霹肝,這樣的話訪問者就無需離開你的站點(diǎn)了。
鏈接到同一個(gè)頁面的不同位置
本例演示如何使用鏈接跳轉(zhuǎn)至文檔的另一個(gè)部分
跳出框架
本例演示如何跳出框架塑煎,假如你的頁面被固定在框架之內(nèi)沫换。
創(chuàng)建電子郵件鏈接
本例演示如何鏈接到一個(gè)郵件。(本例在安裝郵件客戶端程序后才能工作最铁。)
創(chuàng)建電子郵件鏈接 2
本例演示更加復(fù)雜的郵件鏈接讯赏。