Basic HTML Version

|  | Table of Contents |  | View Full Version

Page 41 - 2609_Logiccode
P. 41

    <H2 STYLE="COLOR: #4682B4;  TEXT-ALIGN: CENTER;">The  Graceful  Pink
                     Birds</H2>

                     <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                      Value                             Description
                              Name

                                                LEFT, RIGHT, inline-start,  It specifies where the image should be
                      FLOAT
                                                inline-end                      positioned.

                     Code 8.  Write the HTML code to present the given web page using the float property to wrap 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;"

                                                                                               Making Web Pages Alive  39

| 36 37 38 39 40 41 42 43 44 45 46 |