Dragon Mage Graphics
Image Magic

Read to add images to your site? You must:

  1. Have the image downloaded to your own computer and uploaded to your own site.
  2. Have a HTML file all ready. If you don't have one yet, go to HTML from scratch.

To begin, you have this simple tag to add to your site: (You can change the red font.)

<img src="imagename.jpg">

This is will display the image. Now, of course, this isn't everything you can do with it. You can also:

<img src="imagename.jpg" width="90" height="66" alt="picture">

This particular picture has a width of 90 and a height of 66. How do I know this? Open the image up in Netscape Navigator and you will see it on the top bar. (width x height) and if you open it in Microsoft Internet Explorer, you will have to "Right Click" and highlight "Properties". Adding width and height will make your page load faster!

The alt= part of the tag will do two things. If the person hits "Stop" and does not load all the images, they will see what you put in the "alt" part. In this case, they will just see "Picture" - try to be discriptive! Also, if you wave your mouse over the image, the ALT will pop up, too.

<img src="imagename.jpg" width="90" height="66" alt="picture" align="right">

This is a picture found at Dragon Mage Graphics. Isn't cool looking? It is a background. I think it is nice.

The align= tag can either be "RIGHT" or "LEFT". It will align the image completely left, and will push the text over. To see what I mean, view the file just as is right now. If you want to align the image at CENTER, use the <center> tag.

<a href="http://mage.itgo.com/"> <img src="imagename.jpg" width="90" height="66" alt="picture" align="right" border="0"> </a>

This is a picture found at Dragon Mage Graphics. Isn't cool looking? It is a background. I think it is nice.

This will add a link to your image. You can do any kind of Link that you'd like, but be sure to note the closing of the the link AFTER the image! Also, try to use Border="0" as often as possible. Of course, you don't have to...to see what we have done, view the file.

Belo is a chart of different additions to the IMG tag.

Addition
Meaning
src=
The file name of the image goes after this
width=
Tells the browser the width of the image
height=
Tells the browser the height of the image
alt=
Describes the non-loaded picture
align=
Will align image on the side of the page
border=0
This will remove the border from the image
(if the image is a link)
border=#
Will add a border to the image
(even without a link)

Back to HTML Help.
Back to Dragon Mage Graphics.


© drago. Please do not remove anything from this page. The backgrounds are offered in the free graphics sections.