WEB前端开发>HTML5手册

HTML 5 <img> 标签

定义和用法

<img> 标签定义图像。

HTML 4.01 与 HTML 5 之间的差异

在 HTML 4.01 中，图像的 "align", "border", "hspace" 以及 "vspace" 不赞成使用。在 HTML 5 中，不再支持这些属性。

例子

<img src="smile.gif" alt="smile" />

属性

属性 值 描述 4 5
alt text 定义有关图形的短的描述。 4 5
src URL 要显示的图像的 URL。 4 5
align
  • top
  • bottom
  • middle
  • left
  • right
规定如何根据周围的文本来对齐图像。不支持。请使用 CSS 代替。 4  
border pixels 定义图像周围的边框。不支持。请使用 CSS 代替。 4  
height pixels % 定义图像的高度。 4 5
hspace pixels 定义图像左侧和右侧的空白。不支持。请使用 CSS 代替。 4  
ismap URL 把图像定义为服务器端的图像映射。 4 5
longdesc URL  一个 URL，指向了描述该图像的文档。不支持。 4  
usemap URL 定义作为客户端图像映射的一幅图像。请参阅 <map> 和 <area> 标签，了解其工作原理。 4 5
vspace pixels 定义图像顶部和底部的空白。不支持。请使用 CSS 代替。 4 5
width pixels % 设置图像的宽度。 4 5

标准属性

class, contenteditable, contextmenu, dir, draggable, id, irrelevant, 
lang, ref, registrationmark, tabindex, template, title

如需完整的描述，请访问 HTML 5 中标准属性。

事件属性

onabort, onbeforeunload, onblur, onchange, onclick, oncontextmenu, 
ondblclick, ondrag, ondragend, ondragenter, ondragleave, ondragover, 
ondragstart, ondrop, onerror, onfocus, onkeydown, onkeypress, onkeyup, 
onload, onmessage, onmousedown, onmousemove, onmouseover, onmouseout, 
onmouseup, onmousewheel, onresize, onscroll, onselect, onsubmit, onunload

如需完整的描述，请访问 HTML 5 中事件属性。

TIY 实例

插入图像
本例演示如何在网页中显示图像。
从不同的位置插入图片
本例演示如何将其他文件夹或服务器的图片显示到网页中。
浮动图像
本例演示如何使图片浮动至段落的左边或右边。
调整图像尺寸
本例演示如何将图片调整到不同的尺寸。
制作图像链接
本例演示如何将图像作为一个链接使用。
创建图像地图
本例显示如何创建带有可供点击区域的图像地图。其中的每个区域都是一个超级链接。