定义与用法

The img element defines an image.
为img元素定义图片

---

在HTML和XHTML中的区别

In HTML the <img> tag has no end tag.
在HTML中<img>标签不需要结束标签

In XHTML the <img> tag must be properly closed.
在XHTML中<img>标签必须合理关闭。

The "align", "border", "hspace", and "vspace" attributes of the image element were deprecated in HTML 4.01.
在HTML4.01中img元素属性中的"align", "border", "hspace", 和 "vspace"已不推荐使用

The "align", "border", "hspace", and "vspace" attributes of the image element are not supported in XHTML 1.0 Strict DTD.
在XHTML1.0严密型DTD中对于img元素的"align", "border", "hspace", 和 "vspace"属性不再支持

---

Mozilla Firefox 浏览器与alt属性

If you use the alt attribute in Firefox on images and image maps the text will not show on mouse-over as in other browsers.
在FF浏览器中img的alt在鼠标移到图片上的时候不会出现文字

Firefox uses the alt attribute the way it's meant to be used, like an alternative text if the image won't load, not as a mouse-over text.
对于FF浏览器来说alt中的文字只在图片加载无效后才会被显示，而不是作为一种鼠标移动动到上面就能出现的文字

Firefox does support mouse-over comments on images or image maps if you use a title attribute in the <img> tag.
如果你想要在FF浏览器中有那种鼠标移动到图片上就能出现文字的效果，那么可用标准属性"title"

比如。 <img src="image.gif" alt="bla" title="bla bla bla" />

---

实例

代码	输出结果(图片不存在时)
<img src="angry.gif" alt="Angry" />

---

必要属性

DTD indicates in which DTD the attribute is allowed. S=Strict, T=Transitional, and F=Frameset.
下表中的DTD列指明了被支持的DTD属性。S=Strict（精确的），T=Transitional（传统的），F=Frameset（框架）

属性	值	描述	DTD
alt	text	Defines a short description of the image 定义图片的简单描述	STF
src	URL	The URL of the image to display 所要显示图片的URL	STF

可选属性

属性	值	描述	DTD
align	top bottom middle left right	Specifies how to align the image according to surrounding text. Deprecated. Use styles instead 指定图片的对齐方式(根据周围的文字)[不推荐]可用样式来替代	TF
border	pixels	Defines a border around an image. Deprecated. Use styles instead 定义图片的边框[不推荐]可用样式来替代	TF
height	pixels %	Defines the height of an image 定义图片的高度	STF
hspace	pixels	Defines white space on the left and right side of the image. Deprecated. Use styles instead 定义图片的左右间隙[不推荐]可用样式来替代	TF
ismap	URL	Defines the image as a server-side image map 定义图片为服务器端的图象热区	STF
longdesc	URL	A URL to a document that contains a long description of the image 为图片的描述提供一个URL，目标地址有相关详细文档	STF
usemap	URL	Defines the image as a client-side image map. Look at the <map> and <area> tags to figure out how it works 定义图片的用户端图象热区，可以参考<map>和<area>标签。	STF
vspace	pixels	Defines white space on the top and bottom of the image. Deprecated. Use styles instead 定义图片的上下间隙大小[不推荐]可用样式来替代	TF
width	pixels %	Sets the width of  an image 设置图片的宽度	STF

标准属性

id, class, title, style, lang, xml:lang

For a full description, go to Standard Attributes.
查看完整的属性

事件属性

onclick, ondblclick, onmousedown, onmouseup, onmouseover, onmousemove, onmouseout, onkeypress, onkeydown, onkeyup

For a full description, go to Event Attributes.
查看完整的属性

---

尝试与演示

Insert images
How to display images in your Web page.
如何在你的Web页面内显示图片

Insert images from different locations
How to display images from another folder or another server in your Web page.
如何在页面上显示来自其他服务器上的图片

Aligning images
How to align an image within the text.
如何让文字中的图片进行对齐

Let the image float
How to let an image float to the left or right of a paragraph.
如何让图片浮动到段落的左边或是右边

Adjust an image to different sizes
How to adjust an image to different sizes.
将图片设置成不同的大小

Make a hyperlink of an image
How to use an image as a link.
让图片变成连接

Create an image map
How to create an image map, with clickable regions. Each region is a hyperlink.
如何建立图象热区，每个可点击的区域都为一个超级连接

评论 (0) All

登陆 | 还没注册？