怎么用做網頁的超鏈接

當我們在網頁中點擊一個鏈接時便發生了頁面跳轉動作，例如點擊搜狗指南首頁中的任意分類，便可以進入到該分類的專題頁面，這種跳轉動作便是網頁超鏈接實現的。我們使用html語言編輯網頁，使用html的<a>標簽實現網頁的超鏈接，下面為您介紹<a>標簽的具體用法。

工具/材料

Sublime Text3

操作方法

01
在學習超鏈接之前我們需要了解URL（Uniform Resource Locator）的概念，每一個文件在互聯網上有唯一的地址，該地址被稱為統一資源定位符（URL）。URL格式為：http://host[:port]/path/filename，http表示通過HTTP協議來定位網絡資源，host表示合法的Internet主機域名或IP地址，port為指定的端口號，若port為空，則缺省端口為80，path為文件夾的路徑（絕對路徑和相對路徑），filename為文件名。我們在html中使用代碼<a href="http://zhinan.sogou.com/" target="_target" >鏈接到搜狗指南首頁</a>實現超鏈接，href的內容便是一個URL。我們在html編輯器中某個文件任意位置點擊右鍵，選擇Open in Browser即可打開網頁，如下圖所示。以下所有步驟在編輯完代碼后均需要該操作。
02
html<a>標簽的語法：<a href="網址、鏈接地址" target="目標" title="說明">被鏈接內容</a>。href為相對路徑或絕對路徑或具體的網頁URL地址。taget值可以省略，常用的有以下三種：_blank表示在新窗口中打開鏈接；_parent表示在父窗體中打開鏈接；_self在當前窗體打開鏈接，此為缺省值。target值為_blank時，我們點擊超鏈接會在新的頁面打開超鏈接的內容。步驟1中點擊鏈接跳轉到了搜狗指南首頁，點擊左側的返回按鈕即可返回鏈接所在的頁面。_parent和_self則在原來的頁面打開鏈接的頁面，原來的頁面不復存在。
03
title的值為鏈接的說明，我們將鼠標放在鏈接上時才會出現此說明信息，如下圖所示。另外需要注意的是<a></a>標簽之間必須有文字，即顯示的鏈接文字，若無則顯示不了超鏈接。
04
<a>標簽的作用不止是跳轉到其他的頁面，還可以實現跳轉到當前頁面的指定位置，在頁面過長，需要占到三四個屏幕時使用較多。實現方式有兩種，下面將分別介紹。第一種為同頁面添加錨文本，可實現同頁面內上下跳轉到指定位置。我們同樣使用<a>標簽來定義錨，即要跳轉到的位置，代碼為：<a name="pos">要跳轉的位置</a>，這里定義的錨名字為pos，我們在頁面的另一個地方定義一個超鏈接來指定錨，代碼為：<a href="#pos">，注意href#后的內容要和錨的name屬性值一致。
05
另外一種方法需要使用id屬性，id屬性可用于創建在一個HTML文檔中的書簽標記，該書簽在HTML文檔中是不顯示的。下面我們使用id屬性實現回到頁面頂部的功能，我們在跳轉到的位置使用代碼：，在超鏈接的位置使用代碼：<a href="#top">回到頂部</a> ，同樣href#后的值必須和id屬性的值一致，另外標簽不是必須的，有id屬性的標簽均可。
06
<a>標簽不僅可以實現跳轉到本頁面的指定位置，也可以實現跳轉到其他頁面的指定位置。例如，我們在一個頁面使用id屬性標識當前位置，代碼為：新的一天，在另一個頁面使用代碼<a href="2.html#mubiao">在其他頁面定位</a>實現超鏈接，注意此時href值的寫法。
07
使用<a>標簽給圖片加上超鏈接，點擊某個圖片即可跳轉到指定的頁面。我們在<a>標簽中添加<img>標簽，該標簽用于在網頁顯示圖片，src的值為圖片的位置，可以為絕對路徑也可以為相對路徑，下圖中使用的為相對路徑，點擊文字下面的圖片即可跳轉。
08
使用<a>標簽實現電子郵件鏈接，電子郵件鏈接類似于URL的鏈接方式：格式為：mailto:電子郵件地址，實現代碼為：<a href=mailto:11111@qq.com>郵件投遞</a>，打開網頁并點擊鏈接時會彈出寫郵件窗口，使用郵件客戶端便可打開，如下圖所示。
End