开启掘金成长之旅！这是我参与「掘金日新计划 · 12 月更文挑战」的第6天，点击查看活动详情
图片显示标签<img>
作用
在网页中嵌入一幅图像，该图像可被用户拖拽【可更改属性更改此效果】。
img标签创建的是被引用图像的占位空间
属性
必须属性
alt与src
alt代替文本
属性值为一个字符串【最多可以包含 1024 个字符，其中包括空格和标点】
作用：当图片加载不了时，该文本就是代替图片显示的文本。
加载不了情况：
- 网速太慢
- src 属性中的错误
- 浏览器禁用图像
- 用户使用的是屏幕阅读器
示例:
<html>
<body>
<img src="/i/eg_tup.jpg" alt="上海鲜花港 - 郁金香" />
</body>
</html>
图片资源路径是错的，会显示
src图片资源路径
它的值是图像文件的 URL，也就是引用该图像的文件的的绝对路径或相对路径。
可选属性
height与width图像高度与图像宽度
可以以像素为单位也可以使用包含该标签的父元素的高度的百分比设定。
隐藏的特性
人们不指定图像的实际大小时，浏览器会自动调整图像，使其适应这个预留空间的大小。使用这种方法就可以很容易地为大图像创建其缩略图，以及放大很小的图像。不过如果没有保持其原来的宽度和高度比例，图像会发生扭曲。
而且可能会给文档的显示带来非常大的延迟，因为浏览器在显示相邻的以及后面的文档内容之前，必须要检查每一个图像文件，并计算它们的屏幕空间。
设置宽高浏览器在下载图像之前就预留位置，可以加速文档的显示，还可以避免文档的移动。
ismap服务器端图像的映射
该属性为Boolean属性：
不写的时候说明该属性为false，只写属性不写属性值才是正确用法，证明该元素使用了该值。
作用：
ismap 属性将图像定义为服务器端图像映射，而图像映射指的是带有可点击区域的图像。
当点击一个服务器端图像映射时，相对于图像的左上角的点击坐标会以 URL search参数的形式发送到服务器，特殊的服务器端软件可以根据这些坐标来做出响应。
不过只有当 <img> 元素为带有有效 href 属性的 <a> 元素的后代时，才允许使用 ismap 属性。
usemap客户端图像映射
usemap 属性与 <map> 元素的 name 或 id 属性相关联，以建立 <img> 与 <map> 之间的关系
具体用法看下方的map用法
longdesc图片长描述
浏览器还没有支持，但是很有用
作用
该属性指定一个地址，这个地址是一个用于描述图片信息的页面
与alt作用类似，一般用在描述超过1024个字节时使用。
- 绝对 URL - 指向其他站点（比如 longdesc="example.com/description.txt"）
- 相对 URL - 指向站点内的文件（比如 longdesc="description.txt"）
图片可点击区域<area>
作用
给图像映射指定点击的区域。
该元素总是嵌套在map标签中
属性
必须的属性
alt
属性值为一段字符串，定义此区域的替换文本。
可选属性
coords
该属性客户端图像映射中对鼠标敏感的区域的x，y坐标以及大小，需与shape属性配合使用。shape 属性决定坐标的数字及其含义和敏感区域的形状
如果某个 area 标签中的坐标和其他区域发生了重叠，会优先采用最先出现的 area 标签。浏览器会忽略超过图像边界范围之外的坐标。
shape
规定可点击区域的形状，并定义coords中属性值的意义
shape 属性的值会影响浏览器对 coords 属性的解释。如果未使用 shape 属性，那么会假设使用值 default。依照标准，default 意味着该区域覆盖整个图像。在实际中，浏览器默认使用矩形区域，并期望能找到 4 个 coords 值。如果没有指定形状，而且在标签中也没有包括 4 个坐标，那么浏览器会忽略整个区域
href
规定area区域中点击后要跳转到的目标url
属性值
- 绝对 URL - 指向另一个站点（比如 href="www.example.com/sun.htm"）
- 相对 URL - 指向站点内的某个文件（href="sun.htm"）
- 锚 URL - 指向页面中的锚（href="#sun"）
nohref
属性规定该区域没有相关的链接
属性值为本身
target
和a标签的target一样
图片映射<map>
定义
定义一个客户端图像映射。图像映射（image-map）指带有可点击区域的一幅图像。
需要与area的联用
area 元素永远嵌套在 map 元素内部。area 元素可定义图像映射中的区域
可与img的联用
<img>中的 usemap 属性可引用 <map> 中的 id 或 name 属性（取决于浏览器），所以我们应同时向 <map> 添加 id 和 name 属性
属性值
支持全局属性以及事件属性
必须属性
id
属性值为一个唯一的名称，表示map标签定义的唯一标识。
name
为一个名称，表示 image-map【图像映射】 规定的名称
使用时指定id和name。
之后在标签内部写area标签内容。
在标签外部写img标签内容，并且将usemap的值设为此标签的#id。
这样就可以通过area的shape和coords来确定可响应点击的位置区域，area的href则确定点击后的跳转。
示例
