CSS selectors: basic browser support

非原创，来源网络。感谢原作者奉献如此精彩文章。原文地址： http://dev.l-c-n.com/CSS3-selectors/browser-support.php

These charts compare basic support for the various selectors, pseudo-classes and pseudo-elements defined in the CSS Selectors module. When a selector is flagged as supported, this only means: the UA reacts to the selector in a way that is compatible with the specifications (rephrased: take these results with the proverbial grain of salt). I've followed the selector notation and grouping used by the W3C document.

The links in the first column (selectors) point to simple test cases in this section (when available). The links in the ‘version’ column point to the first occurence of the selector in the specifications: CSS1, CSS 2.1 (CSS 2.0 selectors is not much different) and the already mentioned CSS 3.

See also the detailed overview by David Hammond at nanobox (recent browser versions only). Codebitch e.a. compiled a similar chart some years ago. There is also a chart a Wikipedia.

http://www.css3.info/selectors-test/

contents

1. Simple selectors, combinators, attribute selectors, class and id selectors
2. pseudo-elements
3. pseudo-classes
4. namespaces

legend, color code used

OK	Supported
N	Not Supported
B	Buggy: not implemented according to the specs
P	Only partly implemented.
D	Destroyed: serious bugs in the implementation
-	not tested (yet)
S	Supported, applies to IE 7 win beta, based on release notes and very early testing.

Simple selectors, combinators, attribute selectors, class and id selectors

	version	Gecko 1.0~1.7	Gecko 1.8-1.9	Opera 7.5~8.5	Opera 9, 9.1	Safari 1.0~1.2	Safari 1.3-2.0x	iCab 3.0	IE 7.0 beta Win	IE 6.0 Win	IE 5.5 Win	IE 5.0 Win	IE 5.23 Mac	Konqueror
	version	Gecko 1.0~1.7	Gecko 1.8-1.9	Opera 7.5~8.5	Opera 9, 9.1	Safari 1.0~1.2	Safari 1.3-2.0x	iCab 3.0	IE 7.0 beta Win	IE 6.0 Win	IE 5.5 Win	IE 5.0 Win	IE 5.23 Mac	Konqueror
*	CSS 2	OK	OK	OK	OK	OK	OK	OK	OK	OK	OK	OK	OK	OK
E	CSS 1	OK	OK	OK	OK	OK	OK	OK	OK	OK	OK	OK	OK	OK
E F	CSS 1	OK	OK	OK	OK	OK	OK	OK	OK	OK	OK	OK	OK	OK
E, F (grouping) [18]	CSS 1	OK	OK	OK	OK	OK	OK	OK	OK	OK	OK	OK	B [19]	OK
E > F	CSS 2	OK	OK	OK	OK	OK	OK	OK	S	N	N	N [1]	OK	OK
E + F	CSS 2	OK	OK	OK	OK	OK	OK	OK	S [23]	N	N	N [1]	OK	OK
E ~ F	CSS 3	OK [2]	OK	N	OK	N	N [3]	OK	S	N	N	N [1]	N	OK
E[foo]	CSS 2	OK	OK	OK	OK	OK	OK	OK	S	N	N	N	N	OK
E[foo="bar"]	CSS 2	OK	OK	OK	OK	OK	OK	OK	S	N	N	N	N	OK
E[foo~="bar"]	CSS 2	OK	OK	OK	OK	OK	OK	OK	S	N	N	N	N	OK
E[foo^="bar"]	CSS 3	OK	OK	N	OK	OK	OK	OK	S	N	N	N	N	OK
E[foo$="bar"]	CSS 3	OK	OK	N	OK	OK	OK	OK	S	N	N	N	N	OK
E[foo*="bar"]	CSS 3	OK	OK	N	OK	OK	OK	OK	S	N	N	N	N	OK
E[hreflang|="en"]	CSS 2	OK	OK	OK	OK	OK	OK	OK	S	N	N	N	N	OK
E.class	CSS 1	OK	OK	OK	OK	OK	OK	OK	OK	OK	OK	OK	OK	OK
E#id	CSS 1	OK	OK	OK	OK	OK	OK	OK	OK	OK	OK	OK	OK	OK
E#id.class	CSS 2	OK	OK	OK	OK	OK	OK	OK	S	B	B	B	B	OK
E:not(s)	CSS 3	OK	OK	N	N	OK	OK	N	-	N	N	N	N	OK

pseudo-elements

	version	Gecko 1.0~1.7	Gecko 1.8-1.9	Opera 7.5~8.5	Opera 9, 9.1	Safari 1.0~1.2	Safari 1.3-2.0x	iCab 3.0	IE 7.0 beta Win	IE 6.0 Win	IE 5.5 Win	IE 5.0 Win	IE 5.23 Mac	Konqueror
	version	Gecko 1.0~1.7	Gecko 1.8-1.9	Opera 7.5~8.5	Opera 9, 9.1	Safari 1.0~1.2	Safari 1.3-2.0x	iCab 3.0	IE 7.0 beta Win	IE 6.0 Win	IE 5.5 Win	IE 5.0 Win	IE 5.23 Mac	Konqueror
E::first-line	CSS 1 [17]	OK	OK	B [4]	B [4]	OK	OK	B [4]	B [4]	B [4][5]	B [4] [5]	N	B [4] [6]	OK
E::first-letter	CSS 1 [17]	OK	OK	OK	OK	OK	OK	OK	B [24]	B [5][24]	-	N	OK	OK
E::selection	CSS 3	N	N	N	N	OK	OK	N	-	N	N	N	N	OK
E::before	CSS 2	OK [7]	OK	OK	OK	OK	OK	OK	N	N	N	N	N	OK
E::after	CSS 2	OK [7]	OK	OK	OK	OK	OK	OK	N	N	N	N	N	OK

pseudo-classes

	version	Gecko 1.0~1.7	Gecko 1.8-1.9	Opera 7.5~8.5	Opera 9, 9.1	Safari 1.0~1.2	Safari 1.3-2.0x	iCab 3.0	IE 7.0 beta Win	IE 6.0 Win	IE 5.5 Win	IE 5.0 Win	IE 5.23 Mac	Konqueror
	version	Gecko 1.0~1.7	Gecko 1.8-1.9	Opera 7.5~8.5	Opera 9, 9.1	Safari 1.0~1.2	Safari 1.3-2.0x	iCab 3.0	IE 7.0 beta Win	IE 6.0 Win	IE 5.5 Win	IE 5.0 Win	IE 5.23 Mac	Konqueror
E:link	CSS 1	OK	OK	OK	OK	OK	OK	OK	OK	OK	OK	OK	OK	OK
E:visited	CSS 1	OK	OK	OK	OK	OK	OK	OK	OK	OK	OK	OK	OK	OK
E:active	CSS 1	OK	OK	OK	OK	OK	OK	OK	B [8]	B [8]	B [8]	B [8]	OK	OK
E:hover	CSS 2	OK	OK	OK	OK	OK	OK	OK	S	P [9]	P [9]	P [9]	P [9]	OK
E:focus	CSS 2	OK	OK	P [10]	P [10]	OK	OK	OK	B [8]	B [8]	B [8]	B [8]	OK	OK
E:root	CSS 3	OK	OK	N	N	OK	OK	N	N	N	N	N	OK	OK
E:target	CSS 3	OK [11]	OK	N	N	OK	OK	N	N	N	N	N	N	OK
E:lang()	CSS 2	OK	OK	OK	OK	N	N [3]	OK	N	N	N	N	OK	OK
E:enabled	CSS 3	N	OK	N	P	N	N [3]	N	-	N	N	N	P	OK
E:disabled	CSS 3	N	OK	N	P	N	N [3]	N	-	N	N	N	P	OK
E:checked	CSS 3	OK [21]	OK	N	P	N	N [3]	N	-	N	N	N	P	OK
E:nth-child(n)	CSS 3	N	N	N	N	N	N	N	-	-	-	-	N	OK
E:nth-last-child(n)	CSS 3	N	N	N	N	N	N	N	-	-	-	-	N	OK
E:nth-of-type(n)	CSS 3	N	N	N	N	N	N	N	-	-	-	-	N	-
E:nth-last-of-type(n)	CSS 3	N	N	N	N	N	N	N	-	-	-	-	N	-
E:first-child	CSS 2	OK	OK	OK	OK	OK	OK	OK	B [23]	N	N	N	OK	OK
E:last-child	CSS 3	OK	OK	N	N	OK	D [12]	N	-	N	N	N	N	OK
E:first-of-type	CSS 3	N	N	N	N	N	N [3]	N	-	-	-	-	N	OK
E:last-of-type	CSS 3	N	N	N	N	N	N [3]	N	-	-	-	-	N	OK
E:only-child	CSS 3	N	OK	N	N	OK	D [12]	N	-	N	N	N	N	OK
E:only-of-type	CSS 3	N	N	N	N	N	D [12]	N	-	-	-	-	N	OK
E:empty	CSS 3	OK [13]	OK	N	N	B [22]	B [22]	N	-	N	N	N	N	OK

namespaces

	version	Gecko 1.0~1.7	Gecko 1.8-1.9	Opera 7.5~8.5	Opera 9, 9.1	Safari 1.0~1.2	Safari 1.3-2.0x	iCab 3.0	IE 7.0 beta Win	IE 6.0 Win	IE 5.5 Win	IE 5.0 Win	IE 5.23 Mac	Konqueror
	version	Gecko 1.0~1.7	Gecko 1.8-1.9	Opera 7.5~8.5	Opera 9, 9.1	Safari 1.0~1.2	Safari 1.3-2.0x	iCab 3.0	IE 7.0 beta Win	IE 6.0 Win	IE 5.5 Win	IE 5.0 Win	IE 5.23 Mac	Konqueror
ns|E [15]	CSS 3	OK	OK	B [14]	OK	N	OK	N	N	N	N	N	N	B [20]
*|E	CSS 3	OK	OK	B [16]	OK	N	OK	N	N	N	N	B [16]	B [16]	B [20]
*|*	CSS 3	OK	OK	B [16]	OK	N	OK	N	N	N	N	B [16]	B [16]	B [20]

Notes

1. IE5.0 Win: with white-space surrounding the selector, the browser ignores all E before the combinator, and applies the rules to all element F
2. From Gecko 1.7 upwards
3. Recent (dd 2006-june-30) nightly builds of Webkit support this selector
4. Opera up to 8.5: not supported for application/xhml+xml, lots of bugs with inheritance; Opera 9 fixes some of them, but not all. More bugfixes came with the release of Opera 9.1
   All browsers, except Gecko, Konqueror and Safari: incorrect line-box when combined with :first-letter. IE Windows and IE Mac treat ::first-line as a sort of block-level element.
5. IE Windows (5.5, 6), seemingly supports the double :: notation, it is not clear if this is by design.
6. IE Mac: single : notation only.
7. Gecko, double :: notation from Gecko 1.5 upwards.
8. :active treated as :focus.
9. only for the <a> element. Note also: IE Win, does not support the chaining of various pseudo-classes (a:link:hover or a:hover:visited); only the last pesudo-class in the chain is used.
10. Opera: only for form–elements.
11. Gecko 1.3 and up.
12. Matches all elements. For :last-child this is a regression in Safari 1.3+ and 2.0+ as it works correctly in Safari 1.0 ~ 1.2.x (in the css testsuite; my test page here works correctly, but the pseudo-class is applied to a block level element, and other selectors may override the :last-child). The has partly been fixed in recent nightly WebKit builds (dd 2006-01-11, but see bug 9840 and some related bugs in WebKits Bugzilla database).
13. Gecko 1.7 only. See the notes in my test case.
14. Opera 7.5 applies the rule, even when no namespace is specified. Corrected in Opera 8.
15. tested with the xhtml namespace: xhtml|E.
16. Rule applied, it should be ignored if the concept of namespaces is not supported. In case of Opera, only Opera 7.5 is buggy. IE 5 Win simply ignores the first (namespace specific) part in the chain. I'm not sure if IE Mac has tentative support (experimental) for the universal namespace selector or if this is a bug. I suspect the latter for the same reason as IE Win.
17. CSS 1 and 2: only the single : notation.
18. Grouping: when the group contains a selector (i.e. a css3 combinator such as ~) that is not supported by the UA, it must ignore the whole group. See demo file for some details.
19. IE Mac: it incorrectly recognizes a group that contains selectors or tokens that it does not support.
20. Konqueror 3.5.1: lacks support for namespaces (and application/xhtml+xml in general). Both my tests and all the the namespace tests in the W3C testsuite give very conflicting results. Some selectors are applied when they should not be, some are ignored.
21. Gecko 1.1 and up.
22. Safari — buggy when the styles are applied inline (embeded) and no external stylesheet is linked to the document, see test page.
23. IE 7 (beta): fails when a comment is inserted (comments are actually counted...)
24. IE Windows: incorrect handling of the float property; multiple problems with inheritance. Some of these have been fixed in IE 7.

Misc

• Gecko 1.0 is equal to Mozilla 1.0 and Netscape 7.01; Firefox 1.0 uses the Gecko 1.7 engine; Firefox 1.5 uses Gecko 1.8.
• Not included in this table is the Tasman 0.9 rendering engine (MSN for OS X, also used in Microsoft Office Mac). Refer to the MacEdition chart mentioned above for details. It does include support for most of the CSS3 pseudo-classes, pseudo-elements and selectors