By default the bottom of an image is aligned with the following
text, as shown in this paragraph. You can align images to the top or center of a paragraph
using the ALIGN= attributes TOP and CENTER. Most Web browsers can display inline images (images next to text) that are in GIF or JPEG format. Each image takes time to process and slows down the initial display of a document. Carefully select your images and the number of images in a document.
To include an inline image, enter:
<IMG SRC="ImageName">
where ImageName is the URL of the image file.
The syntax for <IMG SRC> URLs is the same as that used in an anchor HREF. If the image file is a GIF file, then the filename part of ImageName must end with .gif. JPEG image files must end with .jpg or .jpeg.
You should include two other attributes on <IMG> tags to tell your browser the size of the images it is downloading with the text. The HEIGHT and WIDTH attributes let your browser set aside the appropriate space (in pixels) for the images as it downloads the rest of the file.
For example, to include an image of a beer bottle in a file along with the image's dimensions, enter:
<IMG SRC="bottle.gif" HEIGHT=100 WIDTH=65>
You have some flexibility when displaying images. You can have images separated from text and aligned to the left or right or centered. Or you can have an image aligned with text.
Aligning Text with an Image
By default the bottom of an image is aligned with the following
text, as shown in this paragraph. You can align images to the top or center of a paragraph
using the ALIGN= attributes TOP and CENTER.
This text is aligned with the top of the image (<IMG
SRC = "BarHotlist.gif" ALIGN=TOP>). Notice how the browser aligns only
one line and then jumps to the bottom of the image for the rest of the text.
And this text is centered on the image (<IMG
SRC = "BarHotlist.gif" ALIGN=CENTER>). Again, only one line of text is
centered; the rest is below the image.
Some World Wide Web browsers--primarily Lynx--cannot display images. Some users turn off image loading even if their software can display images (especially if they are using a modem or have a slow connection). HTML provides a way to tell readers what they are missing on your pages.
The ALT attribute lets you specify text to be displayed instead of an image. For example:
<IMG SRC="bofc.jpg" ALT="Beer">
