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 实例

插入圖像
本例演示如何在網頁中顯示圖像。
從不同的位置插入圖片
本例演示如何將其他文件夾或服務器的圖片顯示到網頁中。
浮動圖像
本例演示如何使圖片浮動至段落的左邊或右邊。
調整圖像尺寸
本例演示如何將圖片調整到不同的尺寸。
制作圖像鏈接
本例演示如何將圖像作爲一個鏈接使用。
創建圖像地圖
本例顯示如何創建帶有可供點擊區域的圖像地圖。其中的每個區域都是一個超級鏈接。