第六章 鏈 結
HTML功能強大的地方就在於其連結到其他文件的能力,通常WWW瀏程式會將連結文字改變其顏色或加底線以顯示其特殊性(稱為超文字鏈結,或簡稱鏈結)。
在HTML中,唯一與鏈結有關的標籤記號是<a>,代表的是 "anchor"-錨的意思。
<a href="檔案名稱">在此鍵入被視為鏈結的文字</a> 範例如下:
<a href="base_01.htm">回到第一章</a> 執行結果:
這是鏈結到目前所顯示文件同一層目錄中的 "base_01.htm"檔,當然也可以用相對路徑的方式,鏈結到與現在顯示文件不同目錄下的檔案 ( ../ 這是回到上一層的意思),範例如下:
<a href="../class_01.htm">到線上資訊教室的認識電腦篇</a> 執行結果:
這種寫法叫做 "相對路徑",不過你也可以用UNIX中 "絕對路徑" 的表示法告知某檔案存放位置的完整路徑。但一般來說,用 "相對路徑" 是比較好,因為鍵入的字較少,且當你要將一群檔案般移至其它目錄時,較不會影響檔案彼些間的連結性。不過若是要連結到並沒有完全相關的文件時,最好使用 "絕對路徑"。
除了文字的連結外,你也可以利用圖形來做超連結:
在原本放文字的地方,寫入<img>標籤語法,指定圖形檔即可。
走 ! 去 <a href="http://search.yam.org.tw/b5/yam/">
<img src="yam01.gif" border=1></a>蕃薯藤逛逛!!執行結果:
另外, 還可以連結到其他 Internet 網路服務資源
範例如下:
e-mail 範例:
歡迎您的來信指教:<a href="mailto:ljanny@mail.isu.net.tw">ljanny@mail.isu.net.tw</a><p>FTP 範例:
走! 到 <a href="ftp://ftp.ulead.com.tw">ftp.ulead.com.tw </a>看看有什麼好東西<p>GOPHER 範例:
按<a href="gopher://gopher.seed.net.tw">這裡</a>就可以進入資策會SEEDNet 的 Gopher<p>NEWS 範例:
<a href="news:bunny.ntu.edu.tw">台大計中的 News 討論群</a><p>Telnet 範例:
<a href="telnet:bbs.seed.net.tw">Telnet 到 SEEDNet</a>
站台內部的超連結
<a href=#錨的名稱>
<a name=錨的名稱>方法:
1.先在預被連結的文章前面指定<a name="隨意取個名字"></a>
2.在目錄的地方指定<a href="#你隨意取的那個名字">目錄名稱</a>連結到你步驟一取的那個名字的地方。範例如下:
生活無味嗎?來點笑料吧!
<a href="#light">用嘴包尿布</a> |
<a href="#nose">心理測驗</a> |
<a href="#fat">每天都是乾乾</a>
<a name="light"></a>用嘴包尿布
......
<a name="nose"></a>心理測驗
......
<a name="fat"></a>每天都是乾乾
......