Images

        You see all of those torches at the top of the page?? Those are called images. Some of them, like the torch, move, while some don't. Whether the images move or not, they are put on the page in the same way. That is, they all use the same tag and basic attributes.

        I bet you are saying, well you've told me enough about images, now tell me how to actually put the image on the page. Here is the part that counts. The entire script for simply placing an image on a page :



        Notice that I used imagename and imagecode. The imagename is whatever you decide to name the image. Imagecode is the image codebase, may it be .gif, .jpg, .ban, .bmp, whatever, it is whatever the image is coded. Well now, we get to what the script actually means. In basic terms, the IMG is the tag name, and SRC is the attribute. IMG tells the browser that an image is coming up. SRC stands for SOURCE, which tells the browser where to get the image from. Now that we have the basics down, let's look at the various attributes.



        These are the attributes that we will be concerned with in this tutorial. The first, ALT, describes the box that appears when you place the mouse over a image. The torches above have no ALTs, but this one does :

        Notice the box that appears when the mouse is moved over the image, and don't burn your mouse when you put it over the fire, okay!

---

        Our next attribute describes how the aligned with the surrounding text. The only value of this attribute we will be concerned with at this time is the ALIGN="middle". The other values for ALIGN are "bottom" and "top". This tell the browser that the text we be placed next to the middle of the image,

---

        The next two attributes go hand in hand. These are the HEIGHT and WIDTH attributes. These control the HEIGHT and WIDTH of the image. These must be precise and match with that of the original images, or the image will look very strange. The whole look of the image will be skewed. You can expirament with different heights and widths, or you can use the properties of the image to figure it out. Right click on the image and select properties from the menu. Use the numbers given as SIZE to figure out different sizes. The values of both the HEIGHT and WIDTH attribute are numbers.

---

        Now we know how to manipulate images. We must know move on to another concept in HTML : Backgrounds