SRC stands for source. This attribute needs a value, so you'll use the URL of the GIF or JPG file where your image is located.
<IMG SRC= "url">
Where the above example says "URL", put the address where your image is stored. Don't forget to put quotation marks around the URL. Usually when I have problems with a link or image it's because I forgot to put quotation marks, or mis-typed my URL. ALIGN dictates how you want your text to line up in relation to your graphic.
<IMG SRC="url" ALIGN=top>
In the example above, I specified that I want the text I type right after the IMG tag to line up with the top of my graphic. It will look like this:
Flowers
at the top
Notice how my first line of text lines up along the top and the next line skips. If you use ALIGN=middle Your first line of text will start at the middle of your image, and will look like this.
Flowers
in the middle
If you want your text to line up with the bottom of
your image, use this:
<IMG SRC= "url"ALIGN=bottom>
Flowers at the bottom
This places my first line of text along the bottom of the image .
Positioning images
If you only use the IMG tag, your image will usually end up on the left side of your screen. But what if you want your picture of Aunt Mabel on the right side of your Homepage? The answer is to use the align attribute. To place your image along the right side of the page, you can use the ALIGN attribute again.
<IMG SRC = "url" ALIGN = right>
To place the image in the centre of the page, use this;
<IMG SRC = "url" ALIGN = center>
Remember I said that you don't usually need an align attribute to place your image on the left? This is because most browsers will place it there by default. Not all do though, so to be safe, write your image tag like this if you're favouring the left-hand side:
<IMG SRC = "url" ALIGN = left>
These are the basic methods of positioning images on a web page. There is
a way to do this with a little more precision and control, but first you need
to know how to make TABLES Lets combine the two concepts we've discussed
by using an image as a link.
We do this by NESTING an image tag inside a link tag. It'll look like this:
<A HREF = "http://www.weavin.org.au">
<IMG SRC="http://www.weavin.org.au/logo.gif" Border=0>
</A>
This image is linked to the "about weavin" page in this site.
See how the IMAGE tag is neatly place inside the LINK tag? That's called nesting. Remember to put the address of the image inside the image tag, and the address of the page you're linking to inside the link tag. If you include the BORDER=0 attribute, like I did above, you'll lose the blue border around your image.