All we've done so far, and we still haven't gotten to the thing that people used to use CSS for back in the 90s (and some still do), which is basic text formatting. So lets get to it.
First, we need to set a font. I'm partial to sans-serif fonts like Verdana and Arial, and these days I especially like one called Lucida Grande. So that's what I'll use, by adding a line to the body selector that looks like this:
Note the double quotes around the font name: they're necessary in the case of fonts that are longer than one word (and note that semicolons and commas need to go outside the quote marks). The problem with this declaration is that not everybody has Lucida Grande installed on their systems, and if they don't they'll still be stuck with the default font. No good. So we have to cater to a number of eventualities:
That's probably more specificity than we need, because the 'sans-serif' at the end is a catch-all term which, if it were the only value indicated, would probably lead most systems to display the page in either Arial or Helvitica. But you never know, and it doesn't cost very much to cover your bases.
Next, we'll define a size and color:
There are a number of conflicting opinions regarding the unit you should use for font sizes; too conflicting, in fact, to get into here. Pixels work as you expect in most cases, so you might as well stick with them until you come to an opinion on your own about the subject. As far as color is concerned, you note that you don't have to say 'font-color' (and in fact you can't, if you want it to do anything). Note also that #000 (black) is the default color, so we really needn't specify a color at all; but it's good practice to do so anyways, just in case.
Our body selector now looks like this:
Now we see the advantage of the 'cascading' part of CSS: we need only define this sort of thing for the body, and the rules will be applied to all the subsidiary parts of the page.
With our body text now styled, we can move on to specifics--like headings and emphasized text. Add the following to your stylesheet:
This centers the h1 and moves it away from the top of the page, decorates the h2 some to make it more interesting, and for no good reason makes strong text a little reddish (just cause we can). Note that telling both h1 and strong to be bold is only reinforcing their natural inclination; that is, they'd be bold anyways if we didn't mention font-weight in relation to them at all. h2 would also be bold, which is why we set its font-weight explicitly to 'normal.' You also see that we use percentages here for font size, for no particular reason but to show that it can be done (the percentages, of course, are calculated from our orginal font size of 11px).
Next, we move on to spicing up the footer some:
And the non-h1 part of the header:
Up next is the menu, but that deserves its own section.