Style Sheets - Web Standards: Mastering HTML5, CSS3, and XML - page 147

Table 5-1. Absolute CSS Units

Unit Description

in Inch.

cm Centimeter.

mm Millimeter.

pt

1 point is equal to 1/72 inch.

pc 1 pica is equal to 12 points.

px 1 pixel is a dot on the screen.

Font-relative lengths can be expressed in em , ex , and in CSS3 also in ch or rem (Table 5-2 ).

Table 5-2. Font-Relative CSS Units

Unit Description

em

1 em is equal to the current font size, which can be used to automatically adapt the font size
proportions to the font size chosen by the user in the browser. The em unit defines the proportion
of the width and height of a given letter with respect to the point size of a given font. This unit
originates in typography.

ex 1 ex is the x-height of a font (approximately half the font size).

ch The used advance measure of the 0 glyph (ZERO, U+0030) of the font used to render the text.

rem The computed value of font-size on the root element.

In CSS3, lengths can also be expressed relative to the viewport size (Table 5-3 ), which is very useful in
mobile-friendly website design.

Table 5-3. Viewport-Relative CSS3 Units

Unit Description

vw 1% of the width of the initial containing block.

vh 1% of the height of the initial containing block.

vmin The smallest vw and vh .

vmax The largest vw or vh .

■ Note In spite of this variety, only three of these units are used most of the time: % , em , and px .