CSS Font-Size

Setting the size of the font with percentage causes the browser to calculate the size of the font based on the size of the parent element. For eg., if is set too the font size for the body 12 pixels and the font size for p element is set to 125%, the font size for the text in paragraphs is 15 pixels.

You can use following to set type size

* percentage

*length units

*font size

Length units falls into two categories

*Absolute

*Relative.

Absolute Length Units

• Inches(in)
• Centimeters(cm)
• Millimeters(mm)
• Points(pt) : is equal to 1/72nd of an inch
• Picas(pc) : is equal to 12 points.

Note:

• Use Absolute(fixed) measurement for web documents of fixed output.
• If you want to make the text invisible, use the CSS properties visibility or display instead of setting the size of fonts to zero.
• Negative length value, such as -12cm, for font-size is not allowed.
• Mac and Windows render point sizes differently and pixel same.

Relative Length Units

• Em :refer to the default font size set in the preference of the user's browser
• X-height(ex) : refers to the height of the lowercase letter x in the font.
• Pixels(px) : consistently control the size of typography in web documenlt. ( Not good for Netscape Navigator 4.7x, which doesn't display pixel size values correctly and Opera 5 for Mac, which displays pixel lengths smaller than the size set in the style sheet. Also, in IE we can't resize if type used is pixel.)

Font size Keyword

Absolute sizes - xx-small, x-small, small, medium, large, x-large,xx-large.

Relative sizes - larger, smaller.

Advantage of using font size keywords is that it make it easy to enlarge or reduce the size of the text in most browsers, and the font size in browsers never go smaller than nine pixels.