Including an image inside a line works fine if you have only line
one line of text. One aspect of inline images that I’ve sneakily avoided
mentioning so far is that inHTML2.0 this alignment worked only with a single
line of text. If you had multiple lines of text and you included an image in
the middle of it, all the tent around the image (except for the one line) would
appear above and below that image.
What if you want text to flow
around an image? Using HTML2.0, you couldn’t. You were restricted to just as
single line of text on either side of the image, which limited the kinds of
dressings you could do.
To get around this HTML 2.0 ,
limitation Netscape defined two new value for the align attribute of the
<img tag: left and right. These new values were incorporated into HTML 3.2
and are now supported b all current browsers.
Align =”left” and align=”right”
Align =”left” aligns an image
with the left margin, and align =”right” aligns an image with the right margin.
However, these attributes also cause any text that follows the image to be
displayed in the space to the right or left of that image, depending on the
margin alignment:
INPUT
<img src =”tulips. Gif” alt
=”tulips” align =”left”/>
<h1> Mystery tulip Murderer
strikes </h1>
<p> someone, or something,
or something, is killing the tulips of new south Haverford, Virginia. Residents
of this small town are shocked and dismayed by the senseless vandalism that has
struck their tiny town. </p>
<p> New fourth Haverford is
known for its extravagant displays of tulips in the springtime, and a good
portion of its tourist trade relies on the people who come from as far as new
Hampshire to see what has been estimated as up to two hundred thousand tulkps
that bloom in April and may. </p>
<p> or at least the
tourists had been flocking to new south
Haverford until last week, when over the course of three days the flower of
each and every tulip in the town was
neatly clipped off while the town slept. </p>
Figure 7.8 shows an image with
some text aligned next to it.
You can put any HTML text
(paragraphs, lists, headings, other images) after an aligned image, and the
text will be wrapped into the space between the image and the margin. Or you
can have images on both margins and put the text between them. The browser
fills in the space with text to the bottom of the image and then continues
filling in the text beneath the image.
No comments:
Post a Comment