Your SlideShare is downloading. ×
0
!     quot;
#   $%    &         $         %' %
(' $
  % $)         !    $         %)     $

     $   &$        &       %% ...
#    $!   +

<hr />




              3
#   $!       '%                      $
'   &    %        %              &
#
' % ,) %
'%,
'%,


         h2 { border: 2px s...
-          &
 % ! )%                  &               .   %
 ')  &$              /              %) % 0
            &
 -%  ...
1    #            $!
&        %             &
 '   %   ,'   &
 '   %   ,
 '   %   ,$
 '   %   ,


h2 { border-bottom: 2px ...
#    $!       &             ')
                      23        &     %
    '%
               .' %        !

    h2 { borde...
1     #               $!       %% $
&         %                &
     %%   $,'     &
     %%   $,
     %%   $, $
     %%  ...
)       !&           5!                    $
        5!        $!                  %'   &  %% $
              %5 !        ...
*!   !&        5!                        $
#    $!          $     '      &     %        %% $




          h2 { border: 2p...
h1 { background-color:#191970;
  color:#E6E6FA;
  padding: 15px;
  font-family: Georgia, quot;Times New Romanquot;, serif;...
'                %       ('   $
             .             &          5
')           %5             & 67.
(         (' $  ...
&&   !%   ('
$quot;
  *
89
94




                     14
$*&
-     !%                 %$
    . & !&
:                '      $! %
#    '       &    %
1                  &
#    '   ...
8    9   $       7.      !
-    !%          $
1       ;&
1         &
#      '    &    %
#      '&%

9$     58 97 <       &...
9    '   4)
 !       &
 !       &!        5
/ ')
'!       %    ,,
   &                   ( '%   0
 !                 $
1  ...
#           $!    $                   ('   $
<img src=“hat.gif” alt=“top hat” height=“100” width=“100” />
                ...
%% $ >
    5         '!

    %% $ 3     +

              '!


4             !    !
#         %% $
        &      &       !
? @!       %quot;
 #        $!                    '!
                   .                 5        &       $A
          &$...
&$       !
          &                   &$    &
<a href=quot;index.htmlquot;><img src=quot;home.gifquot;
height=quot;19qu...
# $!              '    $ ! %, & $
-% !          '       $ !%& $
/  0
body { background-image: url(background1.gif); }
!& '!     $quot;

h2 { background-color: #d5edb3;
  color: #5c743d;
  font-family: Georgia, quot;Times New Romanquot;, ser...
!'   %  '          #         $!
    $      &%    E$        %
    '   $ !%    FG         &    6

    #     !%      '      #...
1             )
          !       !   !            &'           %

                  $           .
/     $       E$ E $   ...
<img src=“images/home.gif” alt=“Home”
 height=“100” width=“200”/>
                                        28
&  &$   $! %
$5        &$




               30
F&   G    &
           &
F    G    &
                     &
#    '           $       $
         '!
           '!
     %   ...
<map name=quot;boatquot; id=quot;boatquot;>
<area href=quot;http://boat.comquot; shape=quot;rectquot;
  coords=quot;24, 18...
#           &   !     !   $   $                     quot;
     %' 9
     %' * )
      $ K9      /   quot;A
               ...
#   %&     $   %&
?!  &$
#   %&     $   +)   &$
@!
     ?     !
     %&
  && < '   $   =
                         34
L
     &   5     &           5
 %            1        $           ')       '       $ !%
     %   .


9 5%          .    @!...
#5 %            %!        !   $5 !         &
 %$             ('    $

? & &'                $! %           %
     '      !...
IST 561 Spring 2009 Session4, March 2, 2009
IST 561 Spring 2009 Session4, March 2, 2009
IST 561 Spring 2009 Session4, March 2, 2009
IST 561 Spring 2009 Session4, March 2, 2009
IST 561 Spring 2009 Session4, March 2, 2009
IST 561 Spring 2009 Session4, March 2, 2009
IST 561 Spring 2009 Session4, March 2, 2009
Upcoming SlideShare
Loading in...5
×

IST 561 Spring 2009 Session4, March 2, 2009

330

Published on

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

Published in: Technology
0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total Views
330
On Slideshare
0
From Embeds
0
Number of Embeds
0
Actions
Shares
0
Downloads
9
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide

Transcript of "IST 561 Spring 2009 Session4, March 2, 2009"

  1. 1. ! quot; # $% & $ %' % (' $ % $) ! $ %) $ $ &$ & %% $ (' $ # $! $ & $ ' $ !% (' $ & # $! $ & $ *%$ $ ! * )$ && % % ( ' % $ $! % ) ! $$ (' $ 2
  2. 2. # $! + <hr /> 3
  3. 3. # $! '% $ ' & % % & # ' % ,) % '%, '%, h2 { border: 2px solid #ff0000 }
  4. 4. - & % ! )% & . % ') &$ / %) % 0 & -% ! & h2 { border: 2px solid #ff0000; } a { border: 2px solid #ff0000; }
  5. 5. 1 # $! & % & ' % ,' & ' % , ' % ,$ ' % , h2 { border-bottom: 2px solid #ff0000 }
  6. 6. # $! & ') 23 & % '% .' % ! h2 { border: 2px solid #ff0000; padding: 5px; } 4 %% $ $! %quot;
  7. 7. 1 # $! %% $ & % & %% $,' & %% $, %% $, $ %% $, h2 { border: 2px solid #ff0000; background-color: #cccccc; padding-left: 5px; padding-bottom: 10px; padding-top: 10px;}
  8. 8. ) !& 5! $ 5! $! %' & %% $ %5 ! $! %$ %% $ h2 { border: 2px solid #ff0000; background-color: #cccccc; padding: 20px 10px; }
  9. 9. *! !& 5! $ # $! $ ' & % %% $ h2 { border: 2px solid #ff0000; width: 250px; background-color: #cccccc; padding: 30px 10px 5px 20px; }
  10. 10. 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; }
  11. 11. ' % (' $ . & 5 ') %5 & 67. ( (' $ $ ! ' ) %% ') '% % % ') ) ) $ %quot; h2 { background-color: #ff0000 border-top: thin solid #000000} } 13
  12. 12. && !% (' $quot; * 89 94 14
  13. 13. $*& - !% %$ . & !& : ' $! % # ' & % 1 & # ' % 15
  14. 14. 8 9 $ 7. ! - !% $ 1 ;& 1 & # ' & % # '&% 9$ 58 97 < & %% 16
  15. 15. 9 ' 4) ! & ! &! 5 / ') '! % ,, & ( '% 0 ! $ 1 & # &' ' *= 8 97 -) ! $)$ 17
  16. 16. # $! $ (' $ <img src=“hat.gif” alt=“top hat” height=“100” width=“100” /> '! * & $ '! # $! . % ' $ $ '! 3$ $ . )% '! (% $ . 18
  17. 17. %% $ > 5 '! %% $ 3 + '! 4 ! ! # %% $ & & !
  18. 18. ? @! %quot; # $! '! . 5 & $A &$ 4: & &$ 1 BC D ! % 5&$ : quot; # $! $% '! 1 %) & $ ' 5 % . 1! 1? (' $) .
  19. 19. &$ ! & &$ & <a href=quot;index.htmlquot;><img src=quot;home.gifquot; height=quot;19quot; width=quot;85quot; alt=quot;Homequot; /></a> -) !& %% '% &$ # $! # & '% img {border:0 } 22
  20. 20. # $! ' $ ! %, & $ -% ! ' $ !%& $ / 0 body { background-image: url(background1.gif); }
  21. 21. !& '! $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; }
  22. 22. !' % ' # $! $ &% E$ % ' $ !% FG & 6 # !% ' # $! & % '$ $ 5 %) ' $ !% ( ' $6 H ! * 6( % $& $ ! &! $! &$ $) ' % BI I 5% % ! '! ' % 26
  23. 23. 1 ) ! ! ! &' % $ . / $ E$ E $ $0 J ! & '! % 5 &$ '' & & $) &&& ) $ $ $ & &) $& 'E ! '! $
  24. 24. <img src=“images/home.gif” alt=“Home” height=“100” width=“200”/> 28
  25. 25. & &$ $! % $5 &$ 30
  26. 26. F& G & & F G & & # ' $ $ '! '! % '! 31
  27. 27. <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; />
  28. 28. # & ! ! $ $ quot; %' 9 %' * ) $ K9 / quot;A A $ $ &A0 ) %$ & 9! A) % % ,@! $ 9! $ # %$ $ ! $ !% ) $ 3 $ %$ $ 33
  29. 29. # %& $ %& ?! &$ # %& $ +) &$ @! ? ! %& && < ' $ = 34
  30. 30. L & 5 & 5 % 1 $ ') ' $ !% % . 9 5% . @! 5 ,. & 1 '! !&$ & ! 5$ ! &$ 5% & . ' & $ 35
  31. 31. #5 % %! ! $5 ! & %$ (' $ ? & &' $! % % ' ! % $ 4!& ' 5 5)' $ $ %) % & ,,) ! ! $& $ ' ! & &+ ! ) 5% 5 &$ /! . 0 %! '! ! $ 36
  1. A particular slide catching your eye?

    Clipping is a handy way to collect important slides you want to go back to later.

×