In-line Images

The IMG element allows an image document to be inserted within an HTML document. The purpose is to allow pictures to be included within a document and presented with the text, as opposed to having hypertext links that retrieve and display images in a separate viewing window. The IMG element is empty, meaning there is no closing </IMG>. It has three attributes:

SRC="image_url"
SRC give the URL of the image document. The
ALIGN=BOTTOM (MIDDLE, or TOP)
ALIGN tells the browser how to align the image with the neighbouring text. BOTTOM aligns the bottom of the image with the bottom of text, and is the default. MIDDLE aligns the middle of the image with the middle of text, and TOP aligns the top of the image with the top of text. This attribute is optional.
ALT="alternative text"
Some browsers cannot display images: The optional ALT attribute allows you to specify a text alternative to the image, for use by text-only browsers. This attribute is optional.
The syntax of such a tag is
<IMG SRC="image.gif" ALT="This would have been an image">

Examples

Here's an image<IMG SRC="little-ant.gif"><P> And here's what it looks like...

Here's an image


You can specify the alignment of an image.

Here's an image<IMG SRC="little-ant.gif" ALIGN=top><P> Here's an image


Here's an image<IMG SRC="little-ant.gif" ALIGN=middle><P> Here's an image


Here's an image<IMG SRC="little-ant.gif" ALIGN=bottom><P> Here's an image


Tips

If you're going to use little images embedded in your text documents, try to use the same one. Most web browsers will request the image from the server only once and keep it in memory, thus saving network bandwidth and speeding the document to your audience.

Images can be included within a hypertext anchor: thus you can make an image icon behave as a button to access other documents.

Note: At present you can only inline GIF and JPEG images and X-bitmaps (standard extensions are .gif, .xbm, .xpm) using NCSA Mosaic and Netscape.

Note: <IMG> element can not be used to include other HTML text within a given document.


[Next] [Previous] [Index]


HTML 2.0 Checked