img显示本地图片使用的是相对路径 如：
<img src="./imgs/002.jpg">
开发技巧：在实际开发中，一般会在项目目录下创建一个imgs文件夹，将图片资源都放在里面，方便开发时图片调用。如上面显示的那样，./imgs是找到图片的所在目录，/002.jpg是所要选择的图片。
img显示网页图片使用的是绝对路径 如：
<img src="https://ss0.bdstatic.com/5aV1bjqh_Q23odCf/static/superman/img/logo/bd_logo1_31bdc765.png"/>
img下有许多属性可以选择：
1、alt 表示图片加载错误时的显示内容，方便访问者知道该图片的用途。
如：
<img src="./imgs/001.jpg12" alt="logo">
显示结果是：
表示这张图片是一张logo图。
2、align 表示图片在文字中对齐的位置
top顶部对齐，bottom底部对齐，middle居中对齐。默认为底部对齐。
两个悬浮效果 left图片浮动到文字左侧，right图片浮动到文字右侧。
3、通过width和height改变图片的大小
2和3的代码演示如下
<p>一张百度logo<img src="./imgs/001.jpg" width="100"/></p> <p>一张百度logo<img src="./imgs/001.jpg" align="top" width="100"/></p> <p>一张logo<img src="./imgs/002.jpg" align="bottom" width="100"></p> <p>百度logo<img src="./imgs/002.jpg" align="middle" width="100"></p> <p>百度logo<img src="./imgs/002.jpg" align="left" width="100"></p> <p>百度logo<img src="./imgs/002.jpg" align="right" width="100"></p>其中图片都是相对路径下的本地图片
4、点击图片，打开另一个链接
<p>点击图片打开链接 <a href="page1.html" title="点击进入page1界面"> <img src="./imgs/001.jpg" alt="logo" width="200px" align="middle"/></a></p>
其中 page1.html为另外一个html文档，代码如下：
<html> <head> <title>page1界面</title> </head> <body> <p>我是page1</p> </body> </html>点击图片就会打开page1.html。
5、图像映射
<img src="page.jpg" border="0" usemap="#page" alt="pages" /> <map name="page" id="page"> <area shape="circle" coords="180,139,14" href ="page1.html" alt="page1" /> <area shape="circle" coords="129,161,10" href ="page2.html" alt="page2" /> </map>其中area与map合用，且area在map标签下。img的usemap指向map的name。实现点击图片不同位置，进入page1或page2两个不同的链接。
1308
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
