| 1.基本架構：認識鏈結語法，讓您自由自在遨遊於全世界。 |
|
<a href="要連結的 URL 放這裡" target="連結目標">
要顯示的連結文字或圖片放這裡</a> |
| 2.屬性說明。 |
|
| 屬性名稱 |
參數 |
說明 |
| download |
filename |
指定當用戶單擊超鏈接時將下載目標。 |
| href |
URL |
指定鏈接轉到的頁面的 URL |
| target |
_blank
_parent
_self
_top |
指定在何處打開鏈接的文檔
|
|
|
|
|
| 3.CSS a 連結樣式效果設計範例 |
|
<style type="text/css">
a:link{ //設定還沒有瀏覽過的連結
text-decoration:none;
background-color:#ffffff;
}
a:visited { //設定已經瀏覽過的連結
color: green;
background-color: red;
}
a:hover { //設定滑鼠移經的連結
text-decoration:underline;
background-color:#fafafa;
color: blue;
}
a:active { //設定正在點選的連結
text-decoration:none;
background-color:gray;
color: red;
}
</style>
<a href="http://203.204.246.43/webDesign/">家豪教學網</a> |
| 4.內部連結 (頁連結頁) |
| |
<a href="tbox.html">T Box</a>
<a href="../xbox.html">x Box</a>
<a href="file/tbox.html">f Box</a> |
| 5.內部連結 (連接頁內錨點) |
| |
<a name="x1"> 在此設定錨點 </a>
............
...........
<a href="#x1"> 連結到上面錨點 </a> |
| 6.外部連結 |
| |
<a href="http://203.204.246.43/webDesign/">家豪教學網</a>
若外部連結請加上說明及連結模式為 target="_blank"
|
| |
| |
|