Beginning CSS: Cascading Style Sheets for Web Design, 2nd ...

Measurements Based on the Height of the Lowercase Letter xChapter 2: The EssentialsThe ex measurement, also known as x-height, is (like the em) based on the font size. However, the exmeasurement is relative to the height of the lowercase letter x. The ex measurement is another unit ofmeasurement derived from typography.Like measurement in inches, the ex measurement is unreliable, but for different reasons. Because it is difficultto determine the actual height of the lowercase letter x for a given font, most browser creators takea shortcut in implementing the ex measurement. Instead of relying on the height of the lowercase letterx, ex measurement is defined by taking the measurement of half of 1em, or 0.5em. Because of its inconsistencies,ex measurement is yet another unit of measure to be avoided when designing for display on acomputer monitor.Pixel MeasurementsAs you may have guessed from the discussion in this chapter about absolute measurements, pixels, thepx measurement, are measured relative to the computer monitor’s settings. This measurement dependson the resolution of the user’s monitor. For instance, a 1px measurement viewed at a resolution of 800 ×600 is larger than a 1px measurement viewed at a resolution of 1024 × 768.Pixels are easiest to understand when they specify the width and height of an image because mostimages are created based on the number of pixels they contain. This type of image is known as a bitmapimage. Examples of bitmap images are the J-PEG, GIF, and PNG image formats. These image formatsstore information about an image by the pixel, and those are mapped together to create the image thatyou see. To illustrate my point, Figure 2-21 is a screenshot of Safari’s window controls from the upperleft-hand corner of Figure 2-20 while zoomed to the maximum of 1600% in Photoshop. At this level ofdetail the pixels are clearly visible as individual squares, and it becomes easier to imagine what a pixelis, since you’re actually seeing them.Figure 2-2143