網頁製作 1032 數位教材 單元7 : 超連結 主講老師：徐培倫
超連結 單元 7 超連結說明 分割視窗與超連結 不同通訊協定的連結 超連結路徑設定 內部連結 超連結的顏色 作業7
超連結說明 超連結可以將一些相關的文件連結起來，使它們能夠彼此參考 超媒體鏈結的基本標記是 <A> (anchor tag)，這是一個圍堵標記，要用 </A>作為結束，基本語法如下： <A HREF ="URL">連結的文字</A> 例子： <A HREF=http://www.uch.edu.tw>健行科大</A>
分割視窗與超連結 我們可以利用TARGET這個屬性來設定連結的目標 TARGET=_blank 再開啟一瀏覽視窗, 並顯示所要連結的網頁。 TARGET=_self 在目前視窗中顯示所要連結的網頁。 若目前網頁上設定 <BASE TARGET="某個分割視窗">, 會讓連結的畫面呈現在某個分割視窗中。
Target 屬性介紹 TARGET=_blank 再開啟一瀏覽視窗, 並顯示所要連結的網頁。 TARGET=_self 在目前視窗中顯示所要連結的網頁。 若目前網頁上設定 <BASE TARGET="某個分割視窗">, 會讓連結的畫面呈現在某個分割視窗中。
不同通訊協定的連結 連結至健行科大首頁 <A HREF=HTTP://www.uch.edu.tw>健行科大</A> 連結至FTP站： <A HREF= ftp://ftp.nsysu.edu.tw >中山大學檔案伺服器</A> 連結至E-Mail： 以上若有任何意見請寄信至 <A HREF=“mailto:hsupl@uch.edu.tw">我的電子信箱</A>
超連結路徑設定 相對路徑 <A HREF=“my.htm”>我的網頁</A>
相對路徑的設定 list目錄下ex1.htm <A HREF=“list/ex1.htm">前往範例一</A> <A HREF="../ex2.htm">前往範例二</A> 上2層目錄下ex3.htm <A HREF="../../ex3.htm">前往範例三</A> 上1層目錄中list下ex4.htm <A HREF="../list/ex4.htm">前往範例四</A>
內部連結 當HTML文件內容很長時，我們可在文件的前方建立索引以方便使用者查詢，這時我們可以藉由內部連結的方式讓使用者快速地前往相關的部份。 設定內部連結點 <A NAME=s1></a>標題1 使用內部連結 <A HREF=#s1>前往標題1
超連結的顏色 Body屬性可以設定超連結的顏色 LINK=#rrggbb 設定未連結過的文字顏色 VLINK=#RRGGBB 設定已連結過的文字顏色 ALINK=#RRGGBB 指標按在可連結文字上的顏色。 <BODY link="#008000" vlink="#FF00FF" alink="#808000">
作業 7：題目 請修改範例檔 ex7.html 達成下列目的 TITLE : 作業7 學號:xxxx 姓名:xxx 建立 ex7.html 及 ex7sub.html 如下圖
作業7: ex7 and ex7sub
ex7.html 執行結果
請修改 ex7.html 成作業7
作業7 完成檔 ex7a.html 為作業7的完成檔, 畫面如下：