★目前位置→第10章。圖片連結
01.何謂Html 02.基本架構 03.常用標籤 04.字體大小 05.字的變化
06.項目格式 07.走馬燈    08.超連結 09.貼圖標籤 10.圖片連結
11.表格運用 12.插入音樂 13.body設定 14.分割視窗 15.製作表單

一、一般用法
<a href="連結URL"><img src="圖檔所在的URL"></a>
貼圖標籤沒有結束標籤。
<a href="http://m3.dfps.tp.edu.tw">
<img src="http://m3.dfps.tp.edu.tw/images/logo.gif"></a>
 
二、放大縮小圖
<a href="連結URL"><img src="圖檔所在的URL" width="寬" height="高"></a>
可以自由改變大小。
<a href="http://m3.dfps.tp.edu.tw">
<img src="http://m3.dfps.tp.edu.tw/images/logo.gif" width="176" height="62"></a>

註:或沒設定大小則以全圖大小出現,本圖原本大小為88x31的,而此參數將其改為176x62也等於是長寬各放大兩倍了
 
三、連結圖的註解
<a href="連結URL"><img src="圖檔所在的URL" alt="圖片註解"></a>
可在圖未出現前先知道這圖是什麼,且出現後指標停在圖上也會出現圖片註解唷!相當好用。
<a href="http://m3.dfps.tp.edu.tw">
<img src="http://m3.dfps.tp.edu.tw/images/logo.gif" alt="阿助小棧"></a>
阿助小棧
註:當然可結合所有的貼圖功能及各式超連結整合過用,例如可作成按下一個圖就連結為寄出信件給站長等常見的功能。
 
四、外框參數
<a href="連結URL"><img src="圖檔所在的URL" border="大小"></a>
怪了!為何圖作為連結點就會多出一個框框丫,看了好討厭哦!好吧!加上這個參數保証框框跑去躲。
<a href="http://m3.dfps.tp.edu.tw">
<img src="http://m3.dfps.tp.edu.tw/images/logo.gif" border="0"></a>

註:若大小改為0框框就會不見啦!當然也可用5丫8的使框框更大,看你嚕。

HTML語法測試區

HTML語法練習