XHTML教程——超級連結

文章目錄

• 連結練習

超級連結<a>標籤

毫不誇張的說，是超級連結把整個互連網串連了起來。超級連結幾乎可以指向互連網上的任何資源，例如另外一個網頁、一張圖片、一首MP3歌曲、一段視頻等等。而利用XHTML建立超級連結的文法卻非常簡單，只需要一對<a></a>標籤即可：

<a href="這個超級連結將要指向的網址">頁面上將要顯示的文字或者圖片等</a>

例如：

<a href="http://www.cainiao8.com/">菜鳥吧</a>    

將會在瀏覽器中顯示為一個超級連結，點擊它就將進入菜鳥吧（http://www.cainiao8.com/）。效果如下：

菜鳥吧

其中<a>標籤中的href屬性就是這個超級連結所要指向的地址，它可以是一般的網址也可以是郵件的地址，在稍後的練習執行個體中我們將建立一個指向郵件地址的超級連結。<a>和</a>之間的內容（元素）將被作為超級連結顯示在網頁上。注意href屬性值為一般網址（絕對路徑）時，其"http://"是不可以省略的，否則瀏覽器將把它作為相對路徑來識別。絕對路徑與相對路徑的區別不在本XHTML教程的討論範圍之內。如果你不瞭解這個概念，可以到百度搜尋相關的資料。

頁內跳轉超級連結(錨記)

您在瀏覽其他網站的時候可能注意到了，有一些超級連結可以讓您回到頁面的頂端或者是當前網頁內任何一個位置。就像下面這個連結：

回到標題

它的實現方法如下，首先在標題處加上如下代碼：

<h1>XHTML教程——超級連結<a id="biaoti"></a></h1>

而超級連結本身的代碼為：

<a href="#biaoti">回到標題</a>

頁面內的跳轉在您的頁面內有大量的內容時，可以讓你的使用者很快的找到所需要的資訊。通常情況下都是在一些說明性的網頁內做目錄使用。

連結練習

下面練習在之前的"index.html"中添加超級連結。開啟"index.html"，對代碼做如下修改：

<html>  中間代碼省略…… <p><a href="mailto:xxx@xxx.com">聯絡我</a></p>
 <!-- 注意要把郵箱地址改為你自己的 --> <p>Copyright&copy;2005-2006XXX著作權沒有</p> </body> </html> 

儲存之後瀏覽一下自己的網頁，請確認您的網頁與該頁面相同。點擊一下新建立的連結，如果你安裝了Outlook之類的郵件管理軟體，就會開啟一個給自己發送郵件的介面了。