Before you can put an image on a Web page, you need to know the name of the image file and where it's stored on your server (its source, of course.) That way you can instruct the browser on how to find the image it needs.
The easiest place to save the image is in the same folder or directory as your HTML source file, which is where the browser will automatically look for it. If you have many images to organize, you may want to place them in a single folder, called "imag
es" or "stuff," then place that folder (or directory) in the same directory as your HTML file.
My image is called "picture_1.jpg," and it's in a folder called "stuff," which is in the same folder on our server as this HTML file.
The HTML for my monkey image will read like this:
The picture looks like this:
Simple, huh? Now, using the image align tag, I can also control where the image is placed on the page. For instance, I can line it up on the left:
Which - surprise! - pushes it to the right:
Centering an image is a little trickier, because <img align=center> doesn't work on most browsers. Instead, you'll have to first center the paragraph, with <p align=center> (even if you don't have any text), and then place the image.
So, to center our little monkey, we'd write: