homencsa resources partnershipsoutreachsoftware_tech
alliance searchinside ncsa adv_computingsciencedivisions

Say Cheese... Adding Images

Icon
Images are an essential part of design on the WWW. Images can be added to HTML documents with <img src=Image_URL>. Images are treated like text, they can be on the same line or separated with text formatting characters.
If the image file is a GIF file, then the filename part of Image_URL must end with .gif. Filenames of X Bitmap images must end with .xbm.
Extra commands can be added to the <img src=Image_URL> tag. One of the extra commands is the ALIGN= statement. This will allow you to align text with the image. The default setting is even with the bottom of the image. If you want the text aligned with the top or in the middle of the image you can add the ALIGN option as it is shown here:

<html>
<head>

</head>
<body>
<h1>Photo</h1>
<img src=photo.sm.gif> This is the default alignment.
<P>
<img align=middle src=photo.sm.gif> This is aligned to the middle.
<P>
<img align=top src=photo.sm.gif> This is aligned to the top.
<P>
<img align=left src=photo.sm.gif> This is aligned to the left.
<P>
<img align=right src=photo.sm.gif> This is aligned to the right.
<P>
</body>
</html>

Images may also be aligned to the center of the page with the <P align=center> command.

HEIGHTand WIDTH attributes let your browser set aside the appropriate space (in pixels) for the images as it downloads the rest of the file.

<ALT> tags should also be added to the <img src> tag. This allows text to be displayed in place of the image if the user has images turned off or is running a browser that doesn't support images (<IMG ALT= "back" SRC="back.gif" >). Formatted Images

The most important thing about HTML is the ability to link from parts of one document to other information. The next section explains this process, and how to use links.

Intro Links


NCSA
The National Center for Supercomputing Applications
University of Illinois at Urbana-Champaign

[email protected]

Last modified: June 19, 1997