Font sizing samples - using styles
On this page: Samples of different font sizes, set using CSS styles. They should be visible in all modern style-capable browsers, for example FireFox, Internet Explorer, Safari or Opera.
The text below shows what different font settings look like on your computer with your browser set-up. Remember that style support in browsers in not yet quite perfect, so these examples may not all work, or work as they should. When the article was orignially written in October 2000, Netscape 4 (remember that?) was particularly flaky.
To see if there is any difference between the relative and absolute sizes for you, try changing the default fonts used in your browser.
Relative sizes:
larger normal smaller
200% 150% normal 75% 50%
2 ems 1.5 ems normal 0.75 ems 0.5 ems
(An em is the nominal width of the letter M in a font. So, values given in ems are proportional to the size of the font in use. In the above example, the percentage and em equivalents are given to show this.)
Absolute sizes:
16 points 14 points 12 points 10 points 8 points 6 points
20 pixels 16 pixels 14 pixels 12 pixels 11 pixels 10 pixels
You can also specify absolute sizes in centimetres, inches, or picas, but the effect is much the same.
Related information:
Using font tags to set font sizes
Back to article on fonts and accessibility