A Beginner's Tutorial to HTML - Lesson 4 Graphics shows how
to place graphics on your page!
Tutorial to HTML
Image <img> tag The image tag allows you to place
graphic images on your web pages. The attributes are:·
- <src>. This attribute is mandatory, it specifies the source of the
- <align=top|bottom|middle|left|right>. Controls how the image aligns
with the surrounding text.
- <height=?> and <width=?>, where "?" is the size in
pixels. These attributes are beneficial because they tell the browser the size
of the graphic, speeding up loading time.
- <hspace=?> and <vspace=?>, where "?" is the size in
pixels. This tells the browser to leave the specified amount of white space on
the left and right side "hspace" or on the top and bottom
"vspace" of the image.
- <border=?>, where "?" is the size in pixels. Specifies the
size of the border surrounding the image. The default is "border=2".
Use "border=0" if you don't want any border at all..
- <alt="text">, where "text" is whatever text you
specify to best describe the graphic image. This is very important to
non-graphical web browsers and to browsers with automatic graphic loading
This is a sample of an image with the attributes
"align=right height=72 width=72 hspace=25 alt=bumblebee". When you
look at the image in the browser window, notice the box with the word
"bumblebee", this is the "height" and "width"
tags as well as the "alt" tag in action. If you want to have a look,
click on the reload button (Netscape) and then watch the image of the
The code used looks like this: <img src="a_5bumbl.gif" align=right
height=72 width=72 hspace=25 border=0 alt=bumblebee>·
1 (Learning the Basics) | Lesson 2 (Adding Color) | Lesson 3 (Formatting Documents) |
| Lesson 4 (Graphics) |
Lesson 5 (Linking Text &
Graphics) | Lesson 6
| Lesson 7 (Tables) |
Back to HTML Tutorial |
Garvick Home |
Free Recipes | Shopping
Mall | Annual Events |