Length Values

A length value is expressed as a positive or negative number (when permitted), followed immediately by a two-letter abbreviation that represents the units to be used. There should never be any space between the number and the unit designator. Note that a value of 0 (zero) need not have a unit designator. Length units are divided into two types: absolute units, which are (in theory) always measured in the same way, and relative units, which are measured in relation to other things.

Absolute length units

Inches (in)

As you might expect, the same inches found on typical U.S. rulers. The mapping from inches to a monitor or other display device is usually approximate at best because many systems have no concept of the relation of their display areas to “real-world” measurements such as inches. Thus, inches should be used with extreme caution in screen design.

Centimeters (cm)

The centimeters found on rulers the world over. There are 2.54 cm to an inch, and 1 centimeter equals 0.394 inches. The same mapping warnings that applied to inches also apply to centimeters.

Millimeters (mm)

There are 10 millimeters to a centimeter, so you get 25.4 mm to an inch, and 1 millimeter equals 0.0394 inches. Bear in mind the previous warnings about mapping lengths to monitors.

Points (pt)

Points are standard typographical measures used by printers and typesetters for decades and by word-processing programs for many years. By modern definition, there are 72 points to an inch. Therefore, the capital letters of text set to 12 points should be one-sixth of an inch tall. For example, p {font-size: 18pt;} is equivalent to p {font-size: 0.25in;}, assuming proper mapping of lengths to the display environment (see comments above).

Picas (pc)

Another typographical term. A pica is equivalent to 12 points, which means there are 6 picas to an inch. The capital letters of text set to 1 pica should be one-sixth of an inch tall. For example, p {font-size: 1.5pc;} would set text to be the same size as the example declarations found in the definition of points. Keep in mind previous warnings.

Relative length units

em-height (em)

This refers to the em-height of a given font. In CSS, the em-height is equivalent to the height of the character box for a given font. Ems can be used to set relative sizes for fonts; for example, 1.2em is the same as saying 120%.

x-height (ex)

This refers to the x-height of the font. However, the vast majority of fonts do not include their x-height, so many browsers approximate it (poorly) by simply setting 1ex to be equal to 0.5em. The exception is IE5/Mac, which attempts to determine the actual x-height of a font by internally bitmapping a very large “x” and counting pixels!

Pixels (px)

A pixel is a small box on screen, but CSS defines pixels more abstractly. In CSS terms, a pixel is defined to be about the size required to yield 96 pixels per inch. Most user agents ignore this definition in favor of simply addressing the pixels on the monitor. Scaling factors are brought into play when printing, although this scale cannot be relied upon.

..................Content has been hidden....................

You can't read the all page of ebook, please click here login for view all page.
Reset
3.145.74.54