WEB开发网
开发学院网页设计Html HTML图象(IMAGE)标记(TAGS) 阅读

HTML图象(IMAGE)标记(TAGS)

 2007-12-23 11:08:46 来源:WEB开发网   
核心提示: 链入图象的基本语法<--img source---><img src=#> #=图象的 URL<--img description---><img alt=#> #=在浏览器尚未完全读入图象时,在图象位置显示的文字,HTML图象(IMAGE)标记(TAGS),<i

链入图象的基本语法

<------img source------->

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

<------img description------->

<img alt=#>
#=在浏览器尚未完全读入图象时,在图象位置显示的文字。

<img src="http://www.cncms.com.cn/html/f.gif" alt="MY FACE :-)">


<--################## Image aligned with Text ########################-->

图象和文字的对齐

<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 ########################-->

图象在页面中的对齐/布局(Floating Image)

<------img align=left------->

<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------->

<img align=right>

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


<------br clear------->

<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....



<------vspace hspace------->

<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....


<--################## Border ########################-->

边框

<------border------->

<img border=#> #=value

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


<--################## Client Side Image Map ########################-->

客户端图象映射图(Client Side Image Map)

请在下图中用鼠标到处点一点,就会理解“客户端图象映射图”的意思了。

<------Basic------->

<img src=http://www.cncms.com.cn/html/img.gif usemap="MAP-Name">

<map name="MAP-Name">
<area shape="#" coords="#" href="url">
</map>

#
shape="rect" coords="A,A',B,B'"
(A,A')=Upper Left, (B,B')=Lower Right
shape="circle" coords="A,A',R'"
(A,A')=Center, R=Radius
shape="poly" coords="A,A',B,B',C,C'..."
(A,A'>=First Corner, (B,B')=Second Corner, ...

<Text BOTTON><Triangle BOTTON><FACE>

<img src="maphttp://www.cncms.com.cn/html/img.gif" usemap="#Face">

<map name="Face">

<!Text BOTTON>
   <area shape="rect"
         href="page.html" 
         coords="140,20,280,60">

<!Triangle BOTTON>
   <area shape="poly"
         href="image.html"
         coords="100,100,180,80,200,140">

<!FACE>
   <area shape="circle" 
         href="new.html" 
         coords="80,100,60">
</map>

Tags:HTML 图象 IMAGE

编辑录入:coldstar [复制链接] [打 印]
赞助商链接