本文详细讲解了html中的图片标签的多种使用功能，在一个html页面中图片肯定是少不了的，html的img标签也很简单很好掌握的，我们一起来看看吧！
img显示本地图片使用的是相对路径 如：
@@##@@
开发技巧：在实际开发中，一般会在项目目录下创建一个imgs文件夹，将图片资源都放在里面，方便开发时图片调用。如上面显示的那样，./imgs是找到图片的所在目录，/002.jpg是所要选择的图片。
img显示网页图片使用的是绝对路径 如：
@@##@@
img下有许多属性可以选择：
立即学习“前端免费学习笔记（深入）”；
1、alt 表示图片加载错误时的显示内容，方便访问者知道该图片的用途。
如：
@@##@@
显示结果是：
表示这张图片是一张logo图。
2、align 表示图片在文字中对齐的位置
top顶部对齐，bottom底部对齐，middle居中对齐。默认为底部对齐。
两个悬浮效果 left图片浮动到文字左侧，right图片浮动到文字右侧。
3、通过width和height改变图片的大小
2和3的代码演示如下
一张百度logo@@##@@
一张百度logo@@##@@
一张logo@@##@@
百度logo@@##@@
百度logo@@##@@
百度logo@@##@@
其中图片都是相对路径下的本地图片
4、点击图片，打开另一个链接
点击图片打开链接 @@##@@
其中 page1.html为另外一个html文档，代码如下：
page1界面 我是page1
点击图片就会打开page1.html。
5、图像映射
@@##@@
其中area与map合用，且area在map标签下。img的usemap指向map的name。实现点击图片不同位置，进入page1或page2两个不同的链接。
以上就是 html img标签的使用 的所有内容了，希望会给大家带来帮助吧。
相关推荐：
img属性中alt和title的区别图文详解
html中标签之关于创建图像映射详解
html中为什么不使用img标签来控制图片大小？
以上就是html img标签的使用的详细内容，更多请关注创想鸟其它相关文章！
版权声明：本文内容由互联网用户自发贡献，该文观点仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。
如发现本站有涉嫌抄袭侵权/违法违规的内容， 请发送邮件至 chuangxiangniao@163.com 举报，一经查实，本站将立刻删除。
发布者：程序猿，转转请注明出处：https://www.chuangxiangniao.com/p/1545325.html
微信扫一扫 
支付宝扫一扫 
