html 圖像佈局

  鏈入圖象的基本語法

<img src=#> #=圖象的 URL

<img alt=#>
#=在瀏覽器還沒有徹底讀入圖象時,在圖象位置顯示的文字。

<img src="f.gif" alt="MY FACE :-)">
 

+ 圖象和文字的對齊

<img align=#> #=top, middle, bottom

<img src=URL align=top> My face!
插入圖片 My Face! <img src=URL align=middle> My face!
 插入圖片 My Face!
<img src=URL align=bottom> My face!
 擦入圖片My Face!
  • 只有一行文字才能夠放在圖象的兩邊。(不知道翻譯的對不對?)
  • Only one text line can be flown into the both side of Image.

+ 圖象在頁面中的對齊/佈局(Floating Image)

<img align=left>

<img src=URL align=left>My Face!<br>
It is always<br>
smiling.<br>
Hahaha....<br>

My Face!
It is always
smiling.
Hahaha....

<img align=right>

My Face!
It is always
smiling.
Hahaha....

<br clear=all>

<img src=URL align=left>My Face!<br>
It is always
<br clear=all>
smiling.<br>
Hahaha....<br>

My Face!
It is always

smiling.
Hahaha....

<img vspace=# hspace=#> #=value

<img src=URL align=left vspace=10 hspace=20>My Face!<br>
It is always<br>
smiling.<br>
Hahaha....<br>

My Face!
It is always
smiling.
Hahaha....

+ 邊框

<img border=#> #=value

<a href="URL">
<img src=URL border=15>
</a>
 

+ 客戶端圖象映射圖(Client Side Image Map)

相關文章
相關標籤/搜索