Images Examples

Text can go anywhere around an image, unless the image is centered, by using the align attribute of the Image <IMG> tag.

There are many other possible attributes to put in the Image tag, among them:

WIDTH, to specify an image's size horizontally. This is usually used with
HEIGHT, which specifies an image's size vertically. Not only do WIDTH & HEIGHT attributes help the browser put text on screen faster (the dimensions tell the browser to hold space for an image, and text can be displayed around the empty rectangle while the image file downloads), but together, WIDTH & HEIGHT can be used to scale an image; that is, make it appear differently than the actual size of the image file's dimensions. This can be good and bad -- adjusting the size of the image in HTML can severly distort an image, making it appear quite ugly. Plus, adjusting the size in HTML doesn't affect the image's download time -- the image file is still downloaded in its entirety before the browser scales it.
BORDER, to give an image a frame. This is especially useful if the image is also used as a hyperlink.
ALT, to include substitute text for those with their browser's image loading feature disabled, or the visually impaired.
HSPACE, which adds white space to the left and right of an image, and
VSPACE, which adds white space to the top and bottom of an image

Authors must be careful to include sufficient alignment clues to the browser to avoid an awkward layout of multiple graphics zig-zagging down the page.

Ideally, authors use tables to format the location of graphics in relation to surrounding text, so as to avoid that zig-zag effect.

Normally, authors don't use graphics that are anywhere near as large as this one; however, this demonstrates the flexibility of HTML when working with multiple instances of the same graphic and the corresponding trouble authors may find themselves in.

There are many possible attributes to put in the Image Source tag. Text can go anywhere around the image, starting at the top as it does in this example, or in the middle or at the bottom.

Headings Examples
Links Examples
Lists Examples
Rules Examples
Tables Examples
Images Examples