|
|
|
This section defines the units for values of cascading style sheet (CSS) properties. Measurements and positions in cascading style sheet (CSS) properties are made using length units.
A length value is formed by an optional + or -, followed by a number, followed by a two-letter abbreviation that indicates the unit. There are no spaces in a length value; e.g., 1.3 em is not a valid length value, but 1.3em is valid. A length of 0 does not require the two-letter unit identifier.
The following tables define each unit and give an indication of which browsers they are supported by (Yes , No or Quirky). The browsers studied cover Netscape Navigator 4.05, Microsoft Internet Explorer 4.01 and Microsoft Internet Explorer 3.01 for Windows 95 and Macintosh. Much of the compatibility information was extracted from Web Review
.
A relative length unit specifies a length in relation to another length property. Relative length units scale better from one output device to another, such as from a monitor to a printer. Percentages and keywords perform similarly.
| Unit | Description | Windows 95 | Macintosh | ||||
|---|---|---|---|---|---|---|---|
| Nav4 | IE3 | IE4 | Nav4 | IE3 | IE4 | ||
| em | The height of the element's font. | Y | N | Y | Y | N | Y |
| ex | The height of the letter "x". | Q | N | Q | Q | N | Q |
| px | Pixels. | Y | Y | Y | Y | Y | Y |
| % | Percentage. | Y | Y | Y | Y | Y | Y |
An absolute length unit specifies an absolute measurement, such as inches or centimeters. Absolute length units are useful when the physical properties of the output device are known.
| Unit | Description | Windows 95 | Macintosh | ||||
|---|---|---|---|---|---|---|---|
| Nav4 | IE3 | IE4 | Nav4 | IE3 | IE4 | ||
| in | Inches (1 inch = 2.54 centimeters). | Y | Y | Y | Y | Y | Y |
| cm | Centimeters. | Y | Y | Y | Y | Y | Y |
| mm | Millimeters. | Y | Y | Y | Y | Y | Y |
| pt | Points (1 point = 1/72 inches). | Y | Y | Y | Y | Y | Y |
| pc | Picas (1 pica = 12 points). | Y | Y | Y | Y | Y | Y |
| Unit | Description | Windows 95 | Macintosh | ||||
|---|---|---|---|---|---|---|---|
| Nav4 | IE3 | IE4 | Nav4 | IE3 | IE4 | ||
| in | Inches (1 inch = 2.54 centimeters). | Y | Y | Y | Y | Y | Y |
| cm | Centimeters. | Y | Y | Y | Y | Y | Y |
| mm | Millimeters. | Y | Y | Y | Y | Y | Y |
| pt | Points (1 point = 1/72 inches). | Y | Y | Y | Y | Y | Y |
| pc | Picas (1 pica = 12 points). | Y | Y | Y | Y | Y | Y |
As with HTML, a color value is a keyword or a numerical RGB specification - for more information see Tricks n' Tips. Style sheets extends the methods of specifying RGB to four methods. The RGB examples all specify the same colour.
| Unit | Description | Windows 95 | Macintosh | ||||
|---|---|---|---|---|---|---|---|
| Nav4 | IE3 | IE4 | Nav4 | IE3 | IE4 | ||
| <keyword> | The 16 keywords are taken from the Windows VGA palette, e.g. green. Microsoft and Netscape have also extended this list. |
B | Y | Y | B | Y | Y |
| #RGB | Red-green-blue hexidecimal triplet, e.g. #0C0. |
Y | Y | Y | Y | B | Y |
| #RRGGBB | Red-green-blue hexidecimal triplet, e.g. #00CC00. |
Y | Y | Y | Y | B | Y |
| (RRR,GGG,BBB) | rgb(x,x,x) where x is an integer between 0 and 255 inclusive, e.g. rgb(0,204,0). |
Y | N | Y | Y | N | Y |
| (R%,G%,B%) | rgb(y%,y%,y%) where y is a number between 0.0 and 100.0 inclusive, e.g. rgb(0%,80%,0%). |
Y | N | Y | Y | N | B |
A URL value is given by url(foo), where foo is the URL. The URL may be optionally quoted with either single (') or double (") quotes and may contain whitespace before or after the (optionally quoted) URL.
Partial URLs are interpreted relative to the style sheet source, not to the HTML source. Note that Netscape Navigator 4.x incorrectly interprets partial URLs relative to the HTML source. Given this bug, authors may wish to use full URLs where possible.
| Unit | Description | Windows 95 | Macintosh | ||||
|---|---|---|---|---|---|---|---|
| Nav4 | IE3 | IE4 | Nav4 | IE3 | IE4 | ||
| <url(foo)> | URL, e.g. url(http://www.jalfrezi.com/logo.gif). |
B | Y | Y | B | B | Y |
   |  |     |