# 第 4 章 超鏈接和路徑 學習要點： 1.超鏈接的屬性 2.相對與絕對路徑 3.錨點設置 主講教師：李炎恢 本章主要探討?HTML5?中文本元素最重要的一個超鏈接，探討它自身的屬性以及路徑問題。 **一．超鏈接的屬性** &lt;a&gt;元素屬于文本元素，有一些私有屬性或者叫局部屬性。那么，相對應的還有通用屬性或叫做全局屬性。這方面的知識，后面會詳細探討。 | 屬性名稱 | 說明 | | --- | --- | | href | 指定&lt;a&gt;元素所指資源的?URL | | hreflang | 指向的鏈接資源所使用的語言 | | media | 說明所鏈接資源用于哪種設備 | | rel | 說明文檔與所鏈接資源的關系類型 | | target | 指定用以打開所鏈接資源的瀏覽環境 | | type | 說明所鏈接資源的?MIME?類型（比如?text/html） | 在這幾個屬性當中，只有?href?和?target?一般比較常用，而?href?是必須要用的。其他幾個屬性，在&lt;a&gt;元素使用較少，將在?CSS?章節再探討。 **1.href 屬性** ``` <a href="http://www.baidu.com">百度</a> ``` 解釋：href?是必須屬性，否則&lt;a&gt;元素就變成空元素了。如果屬性值是?http://開頭的?URL，意味著點擊跳轉到指定的外部網站。 **2.target 屬性** ``` <a href="http://www.baidu.com" target="_blank">百度</a> ``` 解釋：target?屬性告訴瀏覽器希望將所鏈接的資源顯示在哪里。 | 屬性名稱 | 說明 | | --- | --- | | _blank | 在新窗口或標簽頁中打開文檔 | | _parent | 在父窗框組（frameset）中打開文檔 | | _self | 在當前窗口打開文檔（默認） | | _top | 在頂層窗口打開文檔 | 這四種最常用的是_blank，新建一個窗口。而_self?是默認，當前窗口打開。_parent和_top?是基于框架頁面的，分別表示在父窗口打開和在整個窗口打開。而?HTML5?中，框架基本被廢棄，只能使用&lt;iframe&gt;元素，且以后大量結合?JavaScript?和?PHP?等語言配合，框架用的就很少了。 **二．相對與絕對路徑** 所謂相對路徑，就是相對于鏈接頁面而言的另一個頁面的路徑。而絕對路徑，就是直接從?file:///磁盤符開始的完整路徑。我們在同一個目錄下做上兩個頁面，其中一個頁面鏈接到另一個頁面。 **1.絕對路徑** ``` <a href="file:///D:/備課/HTML5 第一季/code/index2.html">index2</a> ``` 解釋：首先是?file:///開頭，然后是磁盤符，然后是一個個的目錄層次，找到相應文件。這種方式最致命的問題是，當整個目錄轉移到另外的盤符或其他電腦時，目錄結構一旦出現任何變化，鏈接當即失效。 **2.相對路徑** ``` <a href="index2.html">index2</a> ``` 解釋：相對路徑的條件是必須文件都在一個磁盤或目錄下，如果是在同一個目錄下，直接屬性值就是被鏈接的文件名.后綴名。如果在同一個主目錄下，有多個子目錄層次，那就需要使用目錄結構語法。 **3.目錄語法** 同一個目錄：index2.html?或./index2.html； 在子目錄：xxx/index2.html； 在孫子目錄：xxx/xxx/index2.html； 在父目錄：../index2.html； 在爺爺目錄：../../index2.html； **三．錨點設置** 超鏈接也可用來將同一個文檔中的另一個元素移入視野。通過屬性?id?或?name?實現錨點定位。 //鏈接 ``` <a href="#1">第一章</a> <a href="#2">第二章</a> <a href="#3">第三章</a> //錨點 &lt;a name="1"&gt;&lt;/a&gt;&lt;a id="3"&gt;&lt;/a&gt; ```