Quick Reference: Adding Images

In this chapter, you have learned the basics of adding images to your Web pages. Although there is more to learn, this will give you enough to practice with as you become comfortable with HTML. The following table lists some of the markup required to embed and position images on your Web page:

To Do This

Use This

Embed an image

<img src="/books/4/238/1/html/2/image.gif" />

Make an image a link

<a href="webpage.htm"><img 
src="/books/4/238/1/html/2/image.gif" />

Make a combined image link and text link

<a href="webpage.htm"><img 
src="/books/4/238/1/html/2/image.gif" />Place
Text Here</a>

Provide alternate text

<img src="/books/4/238/1/html/2/image.gif" alt="alternate 
text" />

Specify an image’s height and width

<img src="/books/4/238/1/html/2/image.gif" height="#" 
width="#" /> (# in pixels)

Align an image to the left or right, with text wrapping (Deprecated)

<img src="/books/4/238/1/html/2/image.gif" align="left" />
or "right"

Position an image relative to text or another image (Deprecated)

<img src="/books/4/238/1/html/2/image.gif" align="top">
or "middle," or "bottom"

Add white space on the sides of an image (Deprecated)

<img src="/books/4/238/1/html/2/image.gif" hspace="#">
(# in pixels)

Add white space on an image’s top and bottom

<img src="/books/4/238/1/html/2/image.gif" vspace="#" />
(# in pixels)

Use CSS to add a background image (tiled)

<style> body {background-image: 
(url)image.gif} </style>

Use CSS to add a background watermark

<style> body {background-image: 
(url)image.gif; background-attachment:

Use CSS to add a background image down the left side of your page

<style> body {background-image: 
(url)image.gif; background-repeat:
repeat-y; background-position:

Use CSS to add a red inset border around your images

<style> img {border-style: inset;
border-width: thick; border-color:
red} </style>

How to Do Everything with HTML & XHTML
How to Do Everything with HTML & XHTML
ISBN: 0072231297
EAN: 2147483647
Year: 2003
Pages: 126

Similar book on Amazon

flylib.com © 2008-2017.
If you may any questions please contact us: flylib@qtcs.net