Example Three - small change

by Joe Gillespie — Apr 1, 2002

Using exactly the same HTML as the two previous examples but the style properties change slightly to give a completely different look and feel to the page. This time I have used pixel measurements for the font-size and line-height, which means they are 'fixed' and will not change in different browsers. If you need them to change, to work at the maximum number of screenvsizes and resolutions, stick to ems.

<style type="text/css" media="screen"><!--
body
       {
        color:#ccf;
       font-size:12px;
       line-height:24px;
       font-family:Verdana, Geneva, Arial, Helvetica;
      background-color:#609;
       margin-top:40px;
       margin-right:50px;
       margin-left:200px
       }
--></style>

So far, I have only giving a general specification for the <body> of the page. That should cover everything on the page because of the 'inheritance' involved. Often, you will want to change these defaults, to make headings a different color, weight or size, for instance.

As you start to become more specific, the new specifications you make over-ride the default ones.

Del.icio.us Digg Technorati Blinklist Furl reddit Design Float