The standard unit to measure font height in the print world is the point. In the web world, in addition to the point (pt), there are many other ways to measure font sizes. These can be categorized into two groups: fixed-height and relative font**.

##Fixed-height Measurement

points (pt)
picas (pc)
inches (in)
centimeters (cm)
millimeters (mm)

    1 pt = 1/72 of an inch 
    1 pc = 12 pts

Two other fixed-height measurements are available for the web only:

X-height (ex)   Based on the height of the lowercase x character [fig.2].
Pixels (px)   Based on the resolution of the screen.

Using fixed-height measurement on the web is not recommended because the web usually is viewed on screen, and different screens have different resolutions. When you specify 14-point type, it might display much larger or smaller than you expect on different screens. This is most commonly noticed when moving between Windows and Macintosh computers: type typically displays almost 25% smaller on the Mac.

Thus, a better way to set font-size on the web is to use relative font measurement.

##Relative Font Measurement

Ems (em)   Based on the default font size in the viewer's browser.
Percentages (%)   Like ems, based on the default preferences of the browser, and calculated relative to the surrounding text.

    1 em = 16 px (the default font-size of most browsers)*

tip: Think in Pixels, use Ems for the measure.

Font sizes are inherited within the DOM by children from their parent elements. This can make em sizing calculations for nested elements difficult. A good idea is to size everything in pixels first and then convert the measurements over to ems. Composing to a Scale

tip: A good rule of thumb is to select a comfortable size for type: 14pixels and up. Use scales to differentiate headlines, body copy, footers, side notes, and other text-based information.

Once the body text size is determined, the sizes of the other type can be selected within the scale to create hierarchy. The em relationships among different type sizes are also based on where they are on a scale. *More about Em

Em measures relative sizing and can be specified to three decimal places—for example, 1.375em. It is calculated based on the font-size of the parent element.

Here is the formula to convert pixels to em:

    required pixel value ÷ parent font-size = em value

For example, the h1 font-size is 18 pixels. To convert it into em, 18 ÷ 16 = 1.125em (16 pixel is the default body font-size).