Pixels, Points, Picas, and Other Units of Length
Many CSS properties represent lengths. Some of the most important (though far from all) of these include:
|
|
|
|
|
|
|
|
|
|
|
CSS provides many different units to specify length. They fall into two groups:
Absolute units of length, such as inches, centimeters, millimeters, points, and picas
Relative units, such as ems, exes, pixels, and percentages
Absolute units of length are appropriate for printed media (that is, paper), but they should be
avoided in other media. Relative units should be used for all other
media, except for pixels, which probably shouldn’t be used at all. For
example, this style rule sets the dish
element to be exactly 0.5 centimeters
high:
dish { height: 0.5cm }
However, documents intended for display on screen media like television sets and computer monitors
should not be set to fixed sizes. For one thing, the size of an inch
or other absolute unit can vary depending on the resolution of the
monitor. For another, not all users like the same defaults, and what
looks good on one monitor may be illegible on another. Instead, you
should use units that are relative to something, such as an em, which
is relative to the width of the uppercase letter M, in the current
font, or ex, which is relative to the height of the lowercase letter x
in the current font. For example, this rule sets the line-height
property of the story
element to 1.5 times ...
Get XML in a Nutshell, 3rd Edition now with the O’Reilly learning platform.
O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.