HTML入门技巧-使用图片（转载）

　　超文本之所以在很短的时间内如此广泛的受到人们的青睐，很重要的一个原因时它能支持多媒体的特性，如图象、声音、动画等。这一部分，我们先来学习在一个页面中如何插入图象。

1.基本格式

　　超文本支持的图象格式一般有X Bitmap(XBM)、GIF、JPEG三种，所以我们对图片处理后要保存为这三种格式中的任何一种，这样才可以在浏览器中看到。

　　插入图象的标签是<IMG>，其格式为：

　　　　　<IMG SRC="图形文件地址">

　　SRC属性指明了所要链接的图象文件地址，这个图形文件可以是网站上的图形，也可以是位于远端主机上的图形。

　　例：　<IMG SRC="images/ball.gif">

　　IMG还有两个属性是HEIGHT和WIDTH，分别表示图形的高和宽。通过这两个属性，可以改变图形的大小，如果没有设置，图形按原大显示：

<IMG SRC="../../images/tips/ace.gif"> <IMG SRC="../../images/tips/ace.gif" width="160" heigth="210">

2.图形与文字的对齐排列

　　由IMG中的ALIGN属性来设置图文的对齐方式，有以下几种：

ALIGN=top <IMG SRC="../../images/tips/ace.gif" ALIGN="top">姓名：Rose 姓名：Rose ALIGN=middle <IMG SRC="../../images/tips/ace.gif" ALIGN="middle">姓名：Rose 姓名：Rose ALIGN=buttom <IMG SRC="../../images/tips/ace.gif" ALIGN="buttom">姓名：Rose 姓名：Rose ALIGN=texttop <IMG SRC="../../images/tips/ace.gif" ALIGN="texttop">姓名：Rose 姓名：Rose ALIGN=baseline <IMG SRC="../../images/tips/ace.gif" ALIGN="baseline">姓名：Rose 姓名：Rose ALIGN=left <IMG SRC="../../images/tips/ace.gif" ALIGN="left">姓名：Rose 姓名：Rose ALIGN=right <IMG SRC="../../images/tips/ace.gif" ALIGN="right">姓名：Rose 姓名：Rose

3.图文之间的距离设置

　　在HTML文件里图形水平位置的配置，可由HSPACE属性来完成，其垂直位置的配置，由VSPACE来完成。

<IMG SRC="../../images/tips/ace.gif">姓名：Rose 姓名：Rose <IMG SRC="../../images/tips/ace.gif" HSPACE="30">姓名：Rose 姓名：Rose <IMG SRC="../../images/tips/ace.gif" VSPACE="30">姓名：Rose 姓名：Rose

4.图形按钮

　　图形按钮就是使用者通过在图形上单击，就能连接到某个地址上去，其基本格式如下：

　　<A HREF="资源地址"><IMG SRC="图形文件地址"></A>

例：

　　<A HREF="../tech/"><IMA SRC="../../images/tips/ace.gif"></A>

显示结果为：

[返回]