■ 圖形標記

<IMG>

　　欲明白本篇【HTML徹底剖析】之標記分類，請看 【標記一覽】。
　　也請先明白圍堵標記與空標記的分別，請看 【HTML概念】。

　　<IMG> 稱圖形標記，主要用來插入圖形標記，主要用來插入圖片于網頁中，至于其它用處如配合影片檔案等的播放 及影像地圖（Image Map 或稱一圖多鏈接）則不會在此節講述，請看【影像地圖】及【其他標記】。

　　<IMG> 的一般參數設定：

　　例如 <img src="logo.gif" width=100 height=100 hspace=5 vspace=5 border=2 align="top" alt="Logo of PenPals Garden" lowsrc="

• src="logo.gif"
  圖片來源，接受 .gif, .jpg 及 .png 格式，前兩者通行已久，后者則由 96 年開始發展， 于未來取代前兩者。若圖片檔與該 html 檔同處一目錄則只需寫上檔案名稱，否則 必須加上正確的路徑，相對或絕對均可。
• width=100 height=100
  設定圖片大小，此寬度及高度一般采用 pixels 作單位。通常只設為圖片的真實 大小，以免失真，若需要改圖片大小最好使用圖像編輯工具。
• hspace=5 vspace=5
  設定圖片邊沿空白，以免文字或其它圖片貼近。hspace 是設定圖片左右的空間， 是設定圖片上下的空間，高度采用 pixels 作單位。
• border=2
  圖片邊框厚度。
• align="top"
  調整圖片旁邊文字的位置，你可以控制文字出現在圖片的偏上方、中間、底部、 左右等，可選值：top, middle, bottom, left, right，內定為 botom。Netscape 還支持 texttop, baseline, absmiddle, absbottom，
  texttop 表示圖片和文字依頂線對齊，
  baseline 表示圖片對齊到目前文字行底線值，
  absmiddle 表示圖片對齊到目前文字行絕對中央，
  absbottom 表示圖片對齊到目前文字行絕對底部，（絕對底部是指它考慮到比如 y 、g、q 等字的下邊）。
• alt="Logo of PenPal Garden"
  這是用以描述該圖形的文字，若使用文字瀏覽器，由于不支持圖片，這些文字 將會代替圖片被顯示。若支持圖片的瀏覽器，當鼠標移至圖片上該文字也會顯示。
• lowsrc="pre_logo.gif"
  設定先顯示低解析度的圖片，若加入的是一張很大的圖片，下載要很長的時間，這張低 解析度的圖片會先被顯示以免瀏覽者失去興趣，通常是原圖的黑白版本。

例子一：

原代碼	<img src="girl.gif" width=100 height=112 border=0 alt="beautiful girl"> 普通插入
顯示結果	普通插入

例子二：

原代碼	<img src="girl.gif" width=100 height=112 border=0 alt="beautiful" hspace=10 vspace=20"> 設定上下左右空白位置
顯示結果	設定上下左右空白位置

例子三：

原代碼	<img src="girl.gif" width=100 height=112 border=4 alt="beautiful" hspace=10 vspace=20"> 設定上下左右空白位置
顯示結果	設定圖片中間對齊，邊框厚度為 4。

例子四：

原代碼	<img src="girl.gif" width=100 height=112 alt="beautiful lady" align="right" border=0> 設定圖片靠右。
顯示結果	設定圖片靠右。

例子五：

原代碼	<img src="girl.gif" width=200 height=220 alt="I'm not beautiful right now" border=0> 放大了的圖片
顯示結果