The
"IMG" Tag Attributes
The <IMG> tag allows you to insert images
into your web page document, it has no closing tag. Attributes used with tag:
| Attribute |
Explanation |
| SRC |
The only REQUIRED attribute, specifies
the location of the image file to be unsorted in the form of a file name or full URL. |
| ALT |
Designates a string to be displayed in
text-only browsers, or browsers which have been set to disable image loading
temporarily. This string will also be displayed before the image is
loaded in browsers that do support loading graphics. This
tag should
always be included, and will be
discussed later in the context of accessibility issues. |
WIDTH/
HEIGHT |
Specifies the width and height of an
image in pixels. Using these tags is strongly encouraged because
they speed up page loading. They save client software the time it
takes to calculate the image dimensions. This allows the browsers to load the text
first then come back and inset the image without rearranging any of the rest of the page.
If the dimensions the image is given differ from the original image dimensions, the
image will be stretched or shrunk to fit, i.e. distorted, see examples. |
| ALIGN='.." |
Specifies the position of the image in
relation to the text with which it is surrounded. Parameters include: LEFT, RIGHT,
TOP, BOTTOM and MIDDLE. Bottom is the default. Examples. |
HSPACE/
VSPACE |
 These
attributes determine the number of empty pixels to leave on the left and right (HSPACE) or
top and bottom (VSPACE) of the image. The default is usually 2 pixels.
The block M image here, has HSPACE set to 20, and VSPACE set to 5.
Compare the spacing below the image here with the amount of spacing
following the second image below.Compare this alignment to those for the alignment examples
above, where HSPACE and VSPACE attributes were not explicitly set as with the same image
on the left. |
| BORDER |
Designates the width
of the border to be drawn around the image when the image servers
as a hyperlink. The default border is 2. The three hyperlinked
navigation images that follow, have the settings: borders="0",
(not specified, default = 2) and border="5" respectively.
i.e.
<a href="#top"><img
src="top.gif" width="40" height="40"
border="0"
alt="Top of page"></a>
 [Top of page] 
[Lecture Notes]
 [Hicks Home]
|
|