Page 101 - CodePilot V5.0 C7
P. 101
RAPID RECALL Tick ( ) if you know this.
1. Hover is used to apply styles when the mouse pointer moves over the link.
2. External links connect your active web page to a separate web page.
STYLING OF AN IMAGE USING CSS
CSS allows you to enhance the appearance of images. You can use CSS to adjust the size, add
borders and apply special effects like shadows.
The following table lists all CSS properties, their values and descriptions used with the <IMG> tag:
Property Name Value Description
WIDTH Any numeric value in px It sets the width of the image.
or percentage
HEIGHT Any numeric value in px It sets the height of the image.
or percentage
BORDER SOLID, DASHED, DOUBLE It sets the style, width and colour of the
border of the image.
BORDER-RADIUS Any numeric value in px It sets the corners of the image to round.
or percentage
OPACITY A value between 0 and 1 It sets the transparency of an image.
Code Write the HTML code to present the given web page using CSS properties to add a
7 border, rounded edges and opacity 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>
99
Making Web Pages Alive
