The presentation covering CSS formatting and images for XHTML web pages.

2. ! quot;
# $% & $ %' %
(' $
% $) ! $ %) $
$ &$ & %% $
(' $
# $! $ & $ ' $ !% (' $
&
# $! $ & $
*%$ $ !
* )$ && % % ( ' % $ $! %
) ! $$ (' $
2

3. # $! +
<hr />
3

4. # $! '% $
' & % % &
#
' % ,) %
'%,
'%,
h2 { border: 2px solid #ff0000 }

5. - &
% ! )% & . %
') &$ / %) % 0
&
-% ! &
h2 { border: 2px solid #ff0000; }
a { border: 2px solid #ff0000; }

7. 1 # $!
& % &
' % ,' &
' % ,
' % ,$
' % ,
h2 { border-bottom: 2px solid #ff0000 }

8. # $! & ')
23 & %
'%
.' % !
h2 { border: 2px solid #ff0000;
padding: 5px; }
4 %% $ $! %quot;

9. 1 # $! %% $
& % &
%% $,' &
%% $,
%% $, $
%% $,
h2 { border: 2px solid #ff0000;
background-color: #cccccc;
padding-left: 5px;
padding-bottom: 10px;
padding-top: 10px;}

10. ) !& 5! $
5! $! %' & %% $
%5 ! $! %$
%% $
h2 { border: 2px solid #ff0000;
background-color: #cccccc;
padding: 20px 10px;
}

11. *! !& 5! $
# $! $ ' & % %% $
h2 { border: 2px solid #ff0000;
width: 250px;
background-color: #cccccc;
padding: 30px 10px 5px 20px;
}

12. h1 { background-color:#191970;
color:#E6E6FA;
padding: 15px;
font-family: Georgia, quot;Times New Romanquot;, serif; }
h2 { background-color:#AEAED4;
color:#191970;
font-family: Georgia, quot;Times New Romanquot;, serif;
border-bottom: 2px dashed #191970; }

13. ' % (' $
. & 5
') %5 & 67.
( (' $ $ !
' ) %% ') '%
% % ')
) ) $ %quot;
h2 { background-color: #ff0000
border-top: thin solid #000000}
}
13

14. && !% ('
$quot;
*
89
94
14

15. $*&
- !% %$
. & !&
: ' $! %
# ' & %
1 &
# ' %
15

16. 8 9 $ 7. !
- !% $
1 ;&
1 &
# ' & %
# '&%
9$ 58 97 < &
%%
16

17. 9 ' 4)
! &
! &! 5
/ ')
'! % ,,
& ( '% 0
! $
1 &
# &' ' *= 8
97
-) ! $)$
17

18. # $! $ (' $
<img src=“hat.gif” alt=“top hat” height=“100” width=“100” />
'!
* & $
'!
# $! . % '
$
$ '!
3$ $ .
)% '!
(% $ .
18

20. %% $ >
5 '!
%% $ 3 +
'!
4 ! !
# %% $
& & !

21. ? @! %quot;
# $! '!
. 5 & $A
&$
4: & &$
1 BC
D ! % 5&$
: quot;
# $! $% '!
1 %) & $ ' 5 % .
1! 1? (' $) .

22. &$ !
& &$ &
<a href=quot;index.htmlquot;><img src=quot;home.gifquot;
height=quot;19quot; width=quot;85quot; alt=quot;Homequot; /></a>
-) !& %% '%
&$
# $! # & '%
img {border:0 }
22

23. # $! ' $ ! %, & $
-% ! ' $ !%& $
/ 0
body { background-image: url(background1.gif); }

25. !& '! $quot;
h2 { background-color: #d5edb3;
color: #5c743d;
font-family: Georgia, quot;Times New Romanquot;, serif;
padding-left: 30px;
background-image: url(trilliumbullet.gif);
background-repeat: no-repeat;
}

26. !' % ' # $!
$ &% E$ %
' $ !% FG & 6
# !% ' # $!
& % '$ $ 5 %)
' $ !% ( ' $6
H ! * 6( % $& $ !
&! $! &$ $) ' % BI I
5% % ! '! ' %
26

27. 1 )
! ! ! &' %
$ .
/ $ E$ E $ $0
J ! & '!
% 5
&$ ''
& & $) &&& ) $ $
$
& &) $& 'E
! '! $

28. <img src=“images/home.gif” alt=“Home”
height=“100” width=“200”/>
28

30. & &$ $! %
$5 &$
30

31. F& G &
&
F G &
&
# ' $ $
'!
'!
% '!
31

32. <map name=quot;boatquot; id=quot;boatquot;>
<area href=quot;http://boat.comquot; shape=quot;rectquot;
coords=quot;24, 188, 339, 283quot; alt=“fishing boatquot; />
</map>
<img src=quot;boat.jpgquot; usemap=quot;#boatquot; alt=“Lake Michiganquot;
width=quot;416quot; height=quot;350quot; />

33. # & ! ! $ $ quot;
%' 9
%' * )
$ K9 / quot;A
A $ $ &A0
) %$ &
9! A)
% % ,@! $
9! $ #
%$ $
! $
!% ) $
3 $ %$ $
33

34. # %& $ %&
?! &$
# %& $ +) &$
@!
? !
%&
&& < ' $ =
34

35. L
& 5 & 5
% 1 $ ') ' $ !%
% .
9 5% . @! 5 ,.
&
1 '! !&$ &
! 5$ ! &$
5% & . ' &
$
35

36. #5 % %! ! $5 ! &
%$ (' $
? & &' $! % %
' ! % $
4!& ' 5 5)'
$ $ %) % & ,,) !
! $& $ ' ! & &+
!
) 5% 5 &$ /!
. 0 %! '! !
$
36