CSS Forum

**georga** · 05-26-2011, 04:40 AM

I wonder how they differ,what changes have made and advantage and disadvantage of using css3

**vangogh** · 05-26-2011, 04:39 PM

css3 = css2 + css1

css3 builds on top of css2 and adds lots of things to it. Impossible to tell you all of them in a forum thread. It's not that hard to find the changes with a little searching though.

**c69** · 05-31-2011, 07:31 AM

CSS2.1 is stable, old, compatible (IE8+).
CSS3 is new, cool, sometimes buggy, vendor-prefixed, and not cross-browser [yet].

But to be more specific, CSS 3 is not a monolith spec anymore. It consists of modules which have different writing and adoption speeds. Some of them are everywhere now, some are far from it. Look at W3C site for specific modules, and at vendor sites for what parts of CSS3 they currently support.

**DmitryS** · 07-08-2011, 09:53 AM

below text is copied from about.com

Quote:

SS3 offers a bunch of new ways you can write CSS rules with new CSS selectors, as well as a new combinator, and some new pseudo-elements. Three new attribute selectors:

attribute beginning matches exactly
element[foo^="bar"]
The element has an attribute called foo that begins with "bar" e.g. <element foo="barn">
attribute ending matches exactly
element[foo$="bar"]
The element has an attribute called foo that ends with "bar" e.g. <element foo="rebar">
attribute contains the match
element[foo*="bar"]
The element has an attribute called foo that contains the string "bar" e.g. <element foo="rebaring">

16 new pseudo-classes:

:root
The root element of the document. In HTML this is always <html>
:nth-child(n)
use this to match exact child elements or use variables to get alternating matches
:nth-last-child(n)
match exact child elements counting up from the last one
:nth-of-type(n)
match sibling elements with the same name before it in the document tree
:nth-last-of-type(n)
match sibling elements with the same name counting up from the bottom
:last-child
match the last child element of the parent
:first-of-type
match the first sibling element of that type
:last-of-type
match the last sibling element of that type
nly-child
match the element that is the only child of its parent
nly-of-type
match the element that is the only one of its type
:empty
match the element that has no children (including text nodes)
:target
match an element that is the target of the referring URI
:enabled
match the element when it's enabled
:disabled
match the element when it's disabled
:checked
match the element when it's checked (radio button or checkbox)
:not(s)
match when the element does not match the simple selector s

One new combinator:

elementA ~ elementB
match when elementB follows somewhere after elementA, not necessarily immediately