HTML--图象(IMAGE)标记(TAGS)

本文详细介绍了HTML中图象标记的使用方法,包括基本语法、图象与文字的对齐方式、图象在页面中的布局调整、边框设置以及客户端图象映射等高级用法。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

图象(IMAGE)标记(TAGS)


+ 链入图象的基本语法

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

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

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

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)


NCD HOME HTML Design Guide Main Page
Contents || Page || Font || Text Style || Image || Form || Table || Table Advanced
|| Frames || Marquee || Alternative Inline Elements
Tag Index || What's New

Network Communication Design
http://ncdesign.kyushu-id.ac.jp/
C&P 1994-1996 Yuriko Ienaga v91102@vgenda.kyushu-id.ac.jp

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值