Copied from http://damowmow.com/playground/canon.txt 2006-12-15.


CANONICALIZATION OF CASCADING STYLE SHEET VALUES
================================================

Introduction
------------

There are several times when user agents may need to have a canonical
representation of CSS. For example, DOM calls should return CSS in a
canonical form so that scripts do not have to contain entire CSS
parsers just to animate one property. Editors may also wish to use the
canonical form of CSS when presenting it to the user.

There are several steps to canonicalizing CSS. This module concerns
itself merely with the canonicalisation of CSS Values. The CSS Syntax
module may list rules for canonicalization of an overall CSS file, and
the W3C Selectors module may list rules for how to canonicalize
selectors used in CSS or other languages.


Rules
-----

To canonicalise the value of a property, a UA must use the following
steps, in the following order (or behave as if it did).

    * Relative lengths ('em', 'ex', 'px', all the font-size keywords,
      and '%') do not have their units changed. However, absolute
      lengths must be given in millimeters. For example, the canonical
      version of "+012.0pt" is "4.2333mm" (give or take a few
      significant figures).

        Note. _Computed_ values may well be in different units than
        the specified value. UAs should use 'px' or 'mm' as their
        final units for computed length values.

    * When a  of zero is given, then any specified units
      should be removed.

    * Colours (other than system colours, see below) are canonicalized
      to the six-hex-digit #RRGGBB syntax if their alpha component is
      exactly 1.0, and the rgba(r, g, b, a) syntax with integer
      arguments if the alpha component is less than 1.0. For example,
      rgb(0%,100%,0%) becomes #00FF00, but hsla(120,100%,50%,0.9)
      becomes rgba(0, 255, 0, 0.9).

        Note that this means that implementations with color values
        internally stored with more than 32 bits will lose data during
        serialisation.

    * System colours are left in their keyword form.

    * The colour 'transparent' canonicalises to 'transparent' unless
      the UA supports rgba() colours, in which case it canonicalises
      to 'rgba(0, 0, 0, 0)'.

    * Angles are canonicalized to 'deg' and normalized to the range of
      their property. For example, 'azimuth: 700grad' would be
      canonicalized to 'azimuth: 270deg'. This also applies to angle
      keywords as used in the 'elevation' and 'azimuth' properties,
      they are canonicalized to their value in degrees.

    * Times are canonicalized to seconds ('s').

    * Frequencies are canonicalized to Hertz ('Hz').

    * For all integers and real numbers, including those with units,
      these canonicalization steps must be followed: If the number is
      zero, the canonical result is the literal string '0' plus any
      units (for lengths, the unit identifier will have been removed
      before this step). Otherwise, leading and trailing zeros should
      be omitted, any leading '+' must be omitted, the decimal point
      in a real number must be omitted unless there is a fractional
      part, and if the number is in the range -1 < x < 1, then one
      leading zero must be inserted before the decimal point. The
      number of given significant figures is completely UA dependent.

    * Where multiple values may appear in any order without changing
      the meaning of the value (typically represented by a double bar
      || in the value syntax), UAs should use the canonical order as
      given in the syntax (e.g. " 
      " for the 'border' short-hand property).

    * When repeated values may be omitted without changing the meaning
      of the value (e.g. as in the margin and padding properties),
      then the fewest number of values should be given.

    * Where white space may be removed without changing the meaning of
      the value, then it should be removed.

    *  and  values should be quoted.

    * Double quotes (rather than single quotes) shall be used for
      string quotation. (When changing from single quotes to double
      quotes, double quotes already in the string must be escaped.)

    * The quotes in the  form should be removed. (Parenthesises
      that were in the string, along with any other characters not
      legal when the string is not quoted (such as commas), must be
      escaped.)

    * Unnecessary escapes should be removed. (For example, "\z" should
      be represented as "z". This extends to unescaping UNICODE
      escapes, except, of course, if the encoding cannot contain those
      characters!)

    * Where components of the value may be dropped without changing
      the meaning of the value (for example, initial values in
      shorthand properties), then they should be removed. If this
      would remove all the values, then the first allowed value must
      be given (For example, for 'background' that would be
      'transparent' (which itself would canonicalise to rgba(0,0,0,0))
      since 'background-color' is the first component of the value;
      for 'border' it would be '0' since the first component of that
      value is 'border-width').

    * A single space should be added after each comma that is not part
      of a string, except where that would change the meaning of the
      value. For example:

          foo,bar,baz

      ...should become:

          foo, bar, baz

    * Whenever case is insensitive, for example in property or counter
      names, the text should be changed to the canonical case as given
      in the syntax definition. For example, the canonical value of

          COUNTER( PAR-NUM,UPPER-ROMAN ) DISC

      ...is

          counter(par-num, upper-roman) disc

      ...but the colour 'WINDOWTEXT' becomes 'WindowText'.


Examples
--------

These steps should guarantee that there is no data loss, from a CSS
point of view, other than for color values on systems with colors
stored with more than 32 bits. Here are some examples of 'before' and
'after' results on specified values. The 'before' column could be what
the author wrote in a stylesheet, while the 'after' column shows what
querying the DOM should return.

   BEFORE                         AFTER
   background: none;              background: rgba(0, 0, 0, 0);
   outline: none;                 outline: invert;
   border: none;                  border: medium;
   list-style: none;              list-style: disc;

   margin: 0px 1px 1px 1px ;      margin: 0 1px 1px;
   azimuth: behind left;          azimuth: 220deg;

   font-family: a, 'b"', serif;   font-family: "a", "b\"", serif;
   content: url('h)i') '\[\]';    content: url(h\)i) "[]";

   azimuth: leftwards;            azimuth: leftwards;

   color: rgb(18, 52, 86);        color: #123456;
   color: rgba(0.00001, 0, 0, 1); color: #000000;