If you liked the post, Share on Facebook, Tweet and Google Plus (use buttons above). You can also Subscribe to our feed via Email for free.
 |
CSS | HTML - Units of Measurements
on 05 March 2011
Various units are used used for web development in languages such as HTML (Hyper Text Markup Language), CSS (Cascading Style Sheet) etc. Let us understand different types of measurement units in details.
There are two types of units:
- Relative
- Absolute
Relative Units
Relative units give a length relative to another length property, and are preferred since they will better adjust to different media.
Example: Pixel (px), em, percentage (%) etc..
Absolute Units
Absolute length units depends on the output medium, and so are less useful than relative units.
Example: Inch (in), Point (pt) etc..
Units of Measurements in CSS can also be divided into:
- Length Units
- Color Units
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.For e.g. 5 pt is not a valid length value, but 5pt is valid.
When a value is set to zero there's no need to state a unit.
| Unit Name | Abbreviation | Explanation | Relative |
|---|---|---|---|
| Em | Em | The height of a font | Yes |
| Ex | Ex | Height of the letter x in a font | Yes |
| Point | Pt | 1/72 of an inch | No |
| Pica | Pc | 1 pica is 12 points | No |
| Pixel | Px | One dot on a screen | Yes |
| Millimeter | Mm | Printing Unit | No |
| Centimeter | Cm | Printing Unit (1cm=10mm) | No |
| Inch | In | Printing Unit (1in=2.54cm) | No |
| Percentage | % | Best Relative Measurement | Yes |
Color Units
In computers RBG(Red, blue, Green) and CMYK(Cyan, Magenta, Yellow, Black) are both formats are used. But in CSS and HTML only RGB is used as the format.
A color value is a keyword or a numerical RGB specification.
RGB colors are given in one of four ways:
- #rrggbb (e.g., #00cc00) i.e Hexadecimal values.
- #rgb (e.g., #0c0).
- rgb(x,x,x) where x is an integer between 0 and 255 inclusive (e.g., rgb(0,204,0)).
- rgb(y%,y%,y%) where y is a number between 0.0 and 100.0 inclusive (e.g.,rgb(0%,80%,0%)).
Here is a list of Hexadecimal Color Codes.
1 comments:
Thanks for ur post on simple measurement techniques for CSS,HTML.It would really a great help for newbies.
Post a Comment