Slacker's Guide to CSS Home
Selectors
Properties
Values






HTML

Style Sheets

Click Here!

The Slacker's Guide to StyleSheets

Measurements are very important in stylesheets. You can use any one of the following units of measurement to designate the size, width, height, length, or distance of an object.

Points (pt}
Pixels (px)
Inches (in)
Centimeters (cm)
Millimeters (mm)
Picas (pc)
Element font-height (em)
Element X-height (ex)

Applying these measurements can vary considering the circumstances and what property they are values of.

Check out this blurb from Webmonkey concerning CSS and measurement:

Units of Measure

In this blurb, abstract values (notably
values involving units of measure) appear between angle
brackets: <color>. They should be replaced by actual values as
indicated in the key below. 

Length Units 

<length> indicates a number followed by a unit of measure:
24px. 

The number can be an integer or a decimal fraction, and can be
preceded by + or -. 

Units can be absolute or relative: 

Absolute: mm, cm, in, pt, pc (millimeters,
centimeters, inches, points, picas) 

Relative: em, ex, px (the element's font height, the
element's x-height, pixels) 

Font size may be defined in points, pixels, inches,
or centimeters (pt, px, in, cm) or as a percentage. 

<absolute-size> can be: xx-small, x-small, small,
medium, large, x-large, xx-large. 

<relative-size> can be: larger, smaller. 

Percentage Units 

<percentage> indicates a number followed by a % sign: 50%. 

In the text-indent, margin, padding, and width properties,
percentage values are relative to the width of the parent
element. 

In the font-size property, percentage values are relative to the
font size of the parent element. 

In <color> values, percentages can be used to express RGB
values. 

Color Units 

<color> can represent either <color-name> or <rgb> values, as
defined below: 

<color-name> can be: aqua, black, blue, fuchsia,
gray, green, lime, maroon, navy, olive, purple, red,
silver, teal, white, yellow 

<rgb> can be: #<hex><hex><hex> rgb(<number>,
<number>, <number>)
rgb(<percentage>,<percentage>,<percentage>)
<hex> represents a hexidecimal value, <number> a
decimal value, and <percentage> a percentage. 

That's the end of that blurn from Webmonkey. I hope it helped.

| Site Map |
| HTML |
HTML Guide Home
| Page 1 | Page 2 | Page 3 | Page 4 | Page 5 | Page 6 |
ADD'L HTML Help
| Master Tag list | Questions? Comments? |
| Resources | Tips and tricks | Friends of The Slacker's Guide |
| Promote Your Web Site | Gif or JPEG? | Page Layout W/ Tables |
| Cascading Style Sheets |
Slacker's Guide to StyleSheets
| Selectors | Properties in CSS | Values |
Free Quality Software
| Free Tools & Downloads |
Contact
| Email the webmaster |