font-size in Css

Now since you learned the various uses of the preferred
measurements, namely pixels, ems, and percentage. In particular, we looked briefly at sizing
text with ems, and the general consensus is that this is by far the best approach.
However, when it comes to discussing CSS and learning its ways stage by stage, I prefer to
use the pixel measurement, as it is the most easily understood and ensures those who simply
cannot get their head around the concept of ems can still sit at the table with everyone else. Just
to recap, using ems to resize text ensures compatibility with IE6, which cannot resize text defined
with pixels (jump back to Chapter 2 for a full overview of the woes and virtues of the various
units of measurement).
In the following example, a new declaration is added to the body to define the size of the
text in that and all child elements:
/* Specify blanket rules for all elements */
body {
font-family: "Lucida Grande", Arial, Sans-serif;
font-size: 12px;
}
By declaring font-size:12px in combination with the font-family declaration, you will
ensure that all elements will be sized to 12px regardless of any inheritance (unlike ems, which can be influenced heavily through cascading rules), and will of course be rendered in the fonts
you specified earlier.
There are exceptions to this blanket font-size declaration, however. Note that all headings
(<h1>, <h2>, <h3>, and so on) will retain their default font sizes as declared by the browser style
sheet unless you redefine them. In other words, just because you specify a size of 12px in the
body does not mean that level 2 headings will also be 12px, as the browser style sheet has its
own correctly formatted CSS rules such as h1 {font-size:2em}. In any case, why on earth would
anyone want headings to be of equal size to their body text? This is another great example of
the creators of CSS ensuring common sense is not compromised.