CSSugar

Syntactic sugar for CSS - Last Update: June 30, 2009

Make things easier to read and express in CSS.

A JavaScript CSS applicator designed to work with a JavaScript selector engine of choice following CSS JSON notation.

At a Glance

CSSugar(
  {
    //match every even tr element
    "tr:even" : {
      "background": "pink"
    },
    //match every input element of type text
    ":text" : {
      "fontFamily": "Verdana",
      "fontSize": "11px",
      "color": "green"
    },
    //match the second div in the body 
    "body div:gt(1)" : {
      "background": "orange"
    }
  },
  //lets use the jQuery selector engine
  $
);
//now feel the power, even in IE6!

Download

Anyone can view or clone the source code repository at github.

Latest From Trunk

Examples

Discussion

http://groups.google.com/group/cssugar

References

JavaScript Selector Engines

Alternative CSS Serializers

"Flush twice it's a long way to the bay!"