OUTPUT FIGURE 7.9 LINEAR BREAK TO A CLEAR MARGIN.

OUTPUT

FIGURE 7.9 LINEBREAK TO A CLEAR MARGIN.

ADJUSTINGTHE SPACE AROUND IMAGES

With the capability to wrap text around an image, you also might want to add some space between the image and the text the at surrounds it. The vspace and hspace attributes (introduced in HTML 3.2) enable you to make these adjustments. Both take values in pixels; space controls the space above and below the image, and hospice controls the space tot he left and the right. Note that the amount of space you specify is added on both sides of the image. For example, if you use hspace =”10”, 10 pixels of space we will be added on both the left and right sides of the image.

NOTE

The vspace and hspace attributes for the <img> tag are deprecated in HTML 4.01, in favor of using style sheet attributes.

The following HTML code, displayed in figure 7.10, illustrates tow example. The upper examples shows default horizontal and vertical spacing around the image, and the lower example shows the effect produced by the hspace and vspace attribute. Both images use the align = “left” attribute so that the text wraps along the left side of the imager. However, in the bottom example, the text aligns with the extra space above top of the image (added with the vspace attribute).

INPUT

 <img src =”eggplant.fif” alt =”eggplant” align=”left”/>

<p> this is an eggplant. We intend to starry a good ways away from it, because we really don’t like eggplant very much. </p>

<br clear = “left”/>

<img src =”eggplant.gif” alt=”eggplant” vspace =”50” hspace = “50”

Align =”left”/>

<p> this is an eggplant We intend to stay a good ways away from it, because we really don’t like eggplant very much.