Page 102 - CodePilot V5.0 C7
P. 102
<IMG STYLE="BORDER: 5PX solid #FF6347; BORDER-RADIUS: 15PX; OPACITY:
0.7; WIDTH: 300PX;"
SRC="beautiful-flamingos-lake.jpg" ALT="Flamingo Image" >
<P STYLE="COLOR: #2F4F4F; TEXT-ALIGN: CENTER;">Flamingos are tall,
wading birds known for their long legs, elegant necks and distinct pink
feathers.
</P>
</BODY>
</HTML>
WRAPPING TEXT AROUND AN IMAGE
The float property allows you to position an image and allows text to wrap around it. The following
table lists the CSS FLOAT property and values used with the <IMG> tag:
Property Name Value Description
FLOAT LEFT, RIGHT, inline-start, inline-end It specifies where the image should
be positioned.
Code Write the HTML code to present the given web page using the float property to wrap
8 text around the image.
<!DOCTYPE HTML>
<HTML>
<HEAD>
<TITLE>Flamingo Facts</TITLE>
</HEAD>
<BODY STYLE="BACKGROUND-COLOR: #F0F8FF;">
<H1 STYLE="COLOR: #FF6347;
TEXT-ALIGN: CENTER;">All About Flamingos
</H1>
<H2 STYLE="COLOR: #4682B4; TEXT-ALIGN: CENTER;">The Graceful Pink
Birds</H2>
<IMG STYLE="FLOAT: RIGHT; WIDTH: 300PX; HEIGHT: 200PX;"
SRC="beautiful-flamingos-lake.jpg" ALT="Flamingo Image">
<P STYLE="COLOR: #2F4F4F; TEXT-ALIGN: CENTER;">Flamingos are tall,
wading birds known for their long legs, elegant necks and distinct pink
feathers.</P>
100
CodePilot (V5.0)-VII

