|
Authored by: soronlin on Sunday, October 28 2012 @ 05:27 AM EDT |
But like I said, 1px is not one screen pixel, it has not been for a long time.
IIRC it is usually about 1/16th em, but browser manufacturers are free to
redefine it.
See W3C discussion of
units
The px unit is the magic unit of CSS. It is not related
to the current font and also not related to the absolute units. The px unit is
defined to be small but visible, and such that a horizontal 1px wide line can be
displayed with sharp edges (no anti-aliasing). What is sharp, small and visible
depends on the device and the way it is used: do you hold it close to your eyes,
like a mobile phone, at arms length, like a computer monitor, or somewhere in
between, like a book? The px is thus not defined as a constant length, but as
something that depends on the type of device and its typical use.
To get an
idea of the appearance of a px, imagine a CRT computer monitor from the 1990s:
the smallest dot it can display measures about 1/100th of an inch (0.25mm) or a
little more. The px unit got its name from those screen pixels.
Nowadays
there are devices that could in principle display smaller sharp dots (although
you might need a magnifier to see them). But documents from the last century
that used px in CSS still look the same, no matter what the device. Printers,
especially, can display sharp lines with much smaller details than 1px, but even
on printers, a 1px line looks very much the same as it would look on a computer
monitor. Devices change, but the px always has the same visual
appearance.
CSS also defines that raster images (such as photos) are, by
default, displayed with one image pixel mapping to 1px. Thus a photo with a 600
by 400 resolution will be 600px wide and 400px high. The pixels in the photo
thus do not map to pixels of the display device (which may be very small), but
map to px units. That makes it possible to exactly align images to other
elements of a document, as long as you use px units in your style sheet, and not
pt, cm, etc. [ Reply to This | Parent | # ]
|
|
|
|
|