Login | Register   
LinkedIn
Google+
Twitter
RSS Feed
Download our iPhone app
TODAY'S HEADLINES  |   ARTICLE ARCHIVE  |   FORUMS  |   TIP BANK
Browse DevX
Sign up for e-mail newsletters from DevX


advertisement
 

HTML Basics: Using Images : Page 2

Learn how to put graphics and photos into your page.


advertisement

Using an Image as a Link
In addition to using them as visual addition to your page, you can use your images as links to other information.

This is easy to do. Instead of a using a piece of text as the linked item within the anchor tags, you just use the image.

The following example shows how to link to the file "06a-gofrogs.html" using both a text link and an image link. First, we'll create a text link, like this:



<a href="06a-gofrogs.html">Frogs are your friends.<br>
Look at the frog!<br>
Ribbet. Ribbet.<br></a>

which displays like this in a Web browser:

Frogs are your friends.
Look at the frog!
Ribbet. Ribbet.

In the next example, the link tag is exactly the same, but it surrounds the image tag instead of a line of text (the image tag is highlighted in color to make it stand out here):

Frogs are your friends.<br>
<a href="06a-gofrog.html">
<img src="../images/frogtiny.gif" align=left width=50 height=31 border=1 alt=frog picture>
</a><br>
Look at the frog!<br>
Ribbet. Ribbet.<br>

It displays like this in a web browser:

Frogs are your friends.
frog
Look at the frog!
Ribbet. Ribbet.

In the first example clicking on the text "look at the frog!" brings up the frog page. In the second example clicking on the frog picture brings up the frog page.



Comment and Contribute

 

 

 

 

 


(Maximum characters: 1200). You have 1200 characters left.

 

 

Sitemap
Thanks for your registration, follow us on our social networks to keep up-to-date