HTML Images, The Basics
Images in HTML are not difficult to work with, but you have to be careful how to use it.
1. Inserting HTML Images
To add any image into your HTML page, you have to use the <img> tag.
For example if you want to add an image to your web page, you can use:
The above indicates that your image file with the name "image1.jpg" is located under the folder "images" and "src" refers to the location address of the image.
2. Changing HTML Image Width And Height
To change an image width or height all you have to do is add "height" or "width" to the above code for example:
<img src="images/image1.jpg" height="200" width="200">
By adding the attributes of "height" and "width" above you can control the dimensions of any image you insert, and the numbers you use for size are in pixels.
3. Adding A Border To Your HTML Image
To add a border to your image you simply add another attribute to the above stating the border size you need. For example:
<img src="images/image1.jpg" height="200" width="200" border="3">
By adding the attribute border="3" we are saying that the image should have a border of size 3, you can choose any size you want but try not to make it too big.
4. Adding An Alt To Your HTML Image
Lets say that you have images on your web page but for some reason it did not load when you or other people are displaying your site due to server lag or error there is a way you could still let your readers know what kind of image is suppose to be there by adding an "alt" attribute to your image like for example:
<img src="images/image1.jpg" height="200" width="200" border="3" alt="Menu Image">