当前位置: 首页 > 网络学院 > 网页制作基础教程 > HTML > HTML <img>标签
The img element defines an image.
为img元素定义图片
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"属性不再支持
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.
如何建立图象热区,每个可点击的区域都为一个超级连接