Images

The Basics

Let's insert an image...It's easy...Here's the tag:

<img src="grnarrowright.jpg">

The Attributes

There are many of them. Regardless of what you may have heard or experienced in the past you should always include the height and width and alt tags.The others are optional. Here's the way you should do an image:

<img src="grnarrowright.jpg alt="green arrow" height="50" width="50" align="top " border="0" hspace="0" vspace="0"

Alt= The text that shows when the mouse is held over the image. It is a cute thing to include but is actually intended to display text when the user has graphics turned off or is sight impaired and has to use a text reader on their screen.
height= How tall the image is. It is critical that the height and width be included so the browser knows where to leave space in the page as it loads up. If it doesn't know the size of the graphic until it actually loads it it has to go back to rearrange the page to fit which slows down the loading process.
width= Width of the image. See the explanation of height.
align= Tells the border what to do with text alignment which we will study in a few more lesson. For now leave it blank. Possible options are top, middle, bottom, center, right, left, absolute middle, absolute bottom, texttop.
border= Specifies whether you want a border around your image. Generally this is set to "0".
hspace= The horizontal distance from another object next to it in pixels.
vspace= The vertical distance from an object above it.

 

Assignment

Go out on the Internet, find three different images about almost anything that is legal and appropriate except the rock band , , low-rider cars with bikini clad women, Brittany Spears, or mean lookin' wrapper dudes. I've seen too many of those pages and you won't impress me at all.

 

Back to the outline.