This one's easy. When you use your a href, or 'link' tags, anything between the opening <a href.....> tag and the closing </a> tag will be linked. So, to link an image, it's as simple as typing:
"
<a href="http://www.yahoo.com"><img src="smiley.gif"></a>"
which then shows up as:
Or you could use an animation:
"
<a href="http://www.yahoo.com"><img src="face.gif"></a>"
Notice something different between an unlinked and a linked graphic? When we used this picture before, it didn't have a border around it. As soon as you link an image, it throws a border around it. The way you get around this is to state that you don't want a border around your image by typing "
border=0" within your image tag.
Watch:
"
<a href="http://www.yahoo.com"><img src="face.gif" border="0"></a>"
Or you could go the other way!!!
"
<a href="http://www.yahoo.com"><img src="face.gif" border="10"></a>"
Controlling 'where' links open...
There are a number of ways to open a page from a link. You can have it open in the same browser as you are using, or you can get it to open in a new browser. You can open a link from a page which has 'frames' and have the link open in the same browser, but without any frames.
To have it open in the same page where it is, just use the standard link:
"
<a href="http://www.yahoo.com">Click here for Yahoo!!</a>"
To open the page in a new window, you need to add a variable to the "anchor" tag stating that the 'target' for the link is a new, blank page:
"
<a href="http://www.yahoo.com" target="_blank">Click here for Yahoo!!</a>"
If your page uses frames, and you want your link to open up in the full browser window instead of in one frame of it, you need to type in:
"
<a href="http://www.yahoo.com" target="_top">Click here for Yahoo!!</a>"
These are the main ones you need to know, there are more "targets" you can use, such as opening a link within certain frames and stuff like that...but I really don't want to cram your head with a bunch of stuff you'll only get confused on anyway!
That's it for lessons for now!
