The best HTML <img> tag Tutorial In 2024, In this tutorial you can learn Examples,Browser Support,Tag definitions and instructions,Differences between HTML 4.01 and HTML5,Differences between HTML and XHTML,Attributes,Global Properties,Event Properties,Try - Example,related articles,
How to insert an image:
All major browsers support the <img> tag.
<Img> tag defines an HTML page images.
<Img> tag has two required attributes: src and alt.
Note: Technically, the image will not be inserted into the HTML page, but the link to the HTML page.Role <img> tag is to create a placeholder image is referenced.
Tip: by nesting <img> tag in <a> tab, add to the image to link to another document.
HTML5 does not support the following attributes: align, border, hspace, longdesc, vspace.
In HTML 4.01, the following attributes: align, border, hspace, vspace obsolete .
In HTML, <img> tag has no end tag.
In XHTML, <img> tag must be closed properly.
New: HTML5 new property.
属性 | 值 | 描述 |
---|---|---|
align | top bottom middle left right |
HTML5 不支持。HTML 4.01 已废弃。 规定如何根据周围的文本来排列图像。 |
alt | text | 规定图像的替代文本。 |
border | pixels | HTML5 不支持。HTML 4.01 已废弃。 规定图像周围的边框。 |
crossorigin New | anonymous use-credentials |
设置图像的跨域属性 |
height | pixels | 规定图像的高度。 |
hspace | pixels | HTML5 不支持。HTML 4.01 已废弃。 规定图像左侧和右侧的空白。 |
ismap | ismap | 将图像规定为服务器端图像映射。 |
longdesc | URL | HTML5 不支持。HTML 4.01 已废弃。 指向包含长的图像描述文档的 URL。 |
src | URL | 规定显示图像的 URL。 |
usemap | #mapname | 将图像定义为客户器端图像映射。 |
vspace | pixels | HTML5 不支持。HTML 4.01 已废弃。 规定图像顶部和底部的空白。 |
width | pixels | 规定图像的宽度。 |
<img> tag supports HTML global properties .
<img> tag supports HTML event properties .
Insert pictures from different locations
This example demonstrates how different folder or server images to display Web pages.
Create an image link
This example demonstrates how to use the image as a link.
Create image maps
This example demonstrates how to create image maps with clickable areas. Each of these regions is a hyperlink.
HTML Tutorial: HTML Images
HTML DOM Reference Manual: Image Object