非原创，来源网络。感谢原作者奉献如此精彩文章。原文地址： http://msdn2.microsoft.com/en-us/library/cc351024(VS.85).aspx
注：为了获得较好的阅读体验，建议你到文章源地址阅读。这里仅仅为备份。
HTML and CSS Technical Articles
CSS Compatibility and Internet Explorer
This is preliminary documentation and is subject to change.
With each new release of Windows Internet Explorer, support for the Cascading Style Sheets (CSS) standard has steadily improved. Internet Explorer 6 was the first fully CSS Level 1-compliant version of Internet Explorer. Windows Internet Explorer 8 is planned to be a fully CSS Level 2.1-compliant browser, and will support some features of CSS 3.
If the browsers your Web site is targeting include earlier versions of Internet Explorer, however, you want to know the level of CSS compliance for those as well. This article provides an at-a-glance look at CSS compliance across recent versions of Internet Explorer, including support in Internet Explorer 8 Beta 1 for Developers and planned support in the final version of Internet Explorer 8.
This article's organization is loosely based on that of the CSS reference documentation on MSDN. It contains the following sections:
Introduction
Each table lists support status information for grouped CSS features across recent versions of Internet Explorer. In each section, the first table represents features introduced in CSS 2.1 or earlier, and the second table represents features planned for CSS 3.
A value of "Yes" in a cell indicates that that feature is implemented in that version of Internet Explorer. (For the "IE 8.0" column, a value of "Yes" indicates that the feature is currently planned for implementation in Internet Explorer 8.)
A value of "Partial" in a cell indicates that that feature is only partially implemented in that version of Internet Explorer. For more information, click the link to view that feature's reference page on MSDN.
A value of "No" in a cell indicates that that feature is not implemented in that version of Internet Explorer.
Note In the few cases where a feature was supported in Internet Explorer 7, shows as not supported in Internet Explorer 8 Beta 1 for Developers, and then shows as supported in Internet Explorer 8, the discrepancy in support is due to layout engine changes between versions. Support for those features is planned to be reinstated for the final release of Internet Explorer 8.
At-rules
CSS 2.1:
| |
IE 5.0 |
IE 5.5 |
IE 6.0 |
IE 7.0 |
IE 8 Beta 1 |
IE 8.0 |
| @charset |
No |
Yes |
Yes |
Yes |
Yes |
Yes |
| @import |
Yes |
Yes |
Yes |
Yes |
Yes |
Yes |
| @media |
No |
Yes |
Yes |
Yes |
Yes |
Yes |
| @page |
No |
Yes |
Yes |
Yes |
Yes |
Yes |
CSS 3:
| |
IE 5.0 |
IE 5.5 |
IE 6.0 |
IE 7.0 |
IE 8 Beta 1 |
IE 8.0 |
| @font-face |
No |
Yes |
Yes |
Yes |
Yes |
Yes |
| @namespace |
No |
No |
No |
No |
No |
No |
Selectors
Element Selectors
CSS 2.1:
| |
|
IE 5.0 |
IE 5.5 |
IE 6.0 |
IE 7.0 |
IE 8 Beta 1 |
IE 8.0 |
| .value { sRules } |
Class (see Note) |
Partial |
Partial |
Partial |
Yes |
Yes |
Yes |
| #value { sRules } |
ID |
Yes |
Yes |
Yes |
Yes |
Yes |
Yes |
| E { sRules } |
Type |
Yes |
Yes |
Yes |
Yes |
Yes |
Yes |
| * { sRules } |
Universal |
No |
No |
No |
Yes |
Yes |
Yes |
Note Prior to Internet Explorer 7, there was a two-class selector limit per element.
CSS 3:
| |
|
IE 5.0 |
IE 5.5 |
IE 6.0 |
IE 7.0 |
IE 8 Beta 1 |
IE 8.0 |
| ns|E { sRules } |
Namespaced |
No |
No |
No |
No |
No |
No |
Attribute Selectors
CSS 2.1:
| |
|
IE 5.0 |
IE 5.5 |
IE 6.0 |
IE 7.0 |
IE 8 Beta 1 |
IE 8.0 |
| [att=val] { sRules } |
Equality [=] |
No |
No |
No |
Yes |
Yes |
Yes |
| [att] { sRules } |
Existence [] |
No |
No |
No |
Yes |
Yes |
Yes |
| [att|=val] { sRules } |
Hyphen [|=] |
No |
No |
No |
Yes |
Yes |
Yes |
| [att~=val] { sRules } |
Whitespace [~=] |
No |
No |
No |
Yes |
Yes |
Yes |
CSS 3:
| |
|
IE 5.0 |
IE 5.5 |
IE 6.0 |
IE 7.0 |
IE 8 Beta 1 |
IE 8.0 |
| [ns|attr] { sRules } |
Namespaced |
No |
No |
No |
Yes |
Yes |
Yes |
| [att^=val] { sRules } |
Prefix [^=] |
No |
No |
No |
Yes |
Yes |
Yes |
| [att*=val] { sRules } |
Substring [*=] |
No |
No |
No |
Yes |
Yes |
Yes |
| [att$=val] { sRules } |
Suffix [$=] |
No |
No |
No |
Yes |
Yes |
Yes |
Combinators
CSS 2.1:
| |
|
IE 5.0 |
IE 5.5 |
IE 6.0 |
IE 7.0 |
IE 8 Beta 1 |
IE 8.0 |
| E + F { sRules } |
Adjacent Sibling (+) |
No |
No |
No |
Yes |
Yes |
Yes |
| E > F { sRules } |
Child (>) |
No |
No |
No |
Yes |
Yes |
Yes |
| E F { sRules } |
Descendant |
Yes |
Yes |
Yes |
Yes |
Yes |
Yes |
CSS 3:
| |
|
IE 5.0 |
IE 5.5 |
IE 6.0 |
IE 7.0 |
IE 8 Beta 1 |
IE 8.0 |
| E ~ F { sRules } |
General Sibling (~) |
No |
No |
No |
Yes |
Yes |
Yes |
Pseudo-classes
CSS 2.1:
| |
|
IE 5.0 |
IE 5.5 |
IE 6.0 |
IE 7.0 |
IE 8 Beta 1 |
IE 8.0 |
| :active { sRules } |
:active |
No |
No |
No |
Partial |
Partial |
Yes |
| :after { sRules } |
:after |
No |
No |
No |
No |
Yes |
Yes |
| :before { sRules } |
:before |
No |
No |
No |
No |
Yes |
Yes |
| :first-child { sRules } |
:first-child |
No |
No |
No |
Yes |
Yes |
Yes |
| :focus { sRules } |
:focus |
No |
No |
No |
No |
No |
Yes |
| :hover { sRules } |
:hover |
No |
No |
No |
No |
No |
Yes |
| :lang(C) { sRules } |
:lang() |
No |
No |
No |
No |
Yes |
Yes |
| :link { sRules } |
:link |
Yes |
Yes |
Yes |
Yes |
Yes |
Yes |
| :visited { sRules } |
:visited |
Yes |
Yes |
Yes |
Yes |
Yes |
Yes |
CSS 3:
| |
|
IE 5.0 |
IE 5.5 |
IE 6.0 |
IE 7.0 |
IE 8 Beta 1 |
IE 8.0 |
| :root { sRules } |
:root |
No |
No |
No |
No |
No |
No |
| :nth-child() { sRules } |
:nth-child() |
No |
No |
No |
No |
No |
No |
| :nth-last-child() { sRules } |
:nth-last-child() |
No |
No |
No |
No |
No |
No |
| :nth-of-type() { sRules } |
:nth-of-type() |
No |
No |
No |
No |
No |
No |
| :nth-last-of-type() { sRules } |
:nth-last-of-type() |
No |
No |
No |
No |
No |
No |
| :last-child { sRules } |
:last-child |
No |
No |
No |
No |
No |
No |
| :first-of-type { sRules } |
:first-of-type |
No |
No |
No |
No |
No |
No |
| :last-of-type { sRules } |
:last-of-type |
No |
No |
No |
No |
No |
No |
| :only-child { sRules } |
:only-child |
No |
No |
No |
No |
No |
No |
| :only-of-type { sRules } |
:only-of-type |
No |
No |
No |
No |
No |
No |
| :empty { sRules } |
:empty |
No |
No |
No |
No |
No |
No |
| :target { sRules } |
:target |
No |
No |
No |
No |
No |
No |
| :not(X) { sRules } |
:not() |
No |
No |
No |
No |
No |
No |
| :enabled { sRules } |
:enabled |
No |
No |
No |
No |
No |
No |
| :disabled { sRules } |
:disabled |
No |
No |
No |
No |
No |
No |
| :checked { sRules } |
:checked |
No |
No |
No |
No |
No |
No |
| :indeterminate { sRules } |
:indeterminate |
No |
No |
No |
No |
No |
No |
| :default { sRules } |
:default |
No |
No |
No |
No |
No |
No |
| :valid { sRules } |
:valid |
No |
No |
No |
No |
No |
No |
| :invalid { sRules } |
:invalid |
No |
No |
No |
No |
No |
No |
| :in-range { sRules } |
:in-range |
No |
No |
No |
No |
No |
No |
| :out-of-range { sRules } |
:out-of-range |
No |
No |
No |
No |
No |
No |
| :required { sRules } |
:required |
No |
No |
No |
No |
No |
No |
| :optional { sRules } |
:optional |
No |
No |
No |
No |
No |
No |
| :read-only { sRules } |
:read-only |
No |
No |
No |
No |
No |
No |
| :read-write { sRules } |
:read-write |
No |
No |
No |
No |
No |
No |
Pseudo-elements
CSS 2.1:
| |
|
IE 5.0 |
IE 5.5 |
IE 6.0 |
IE 7.0 |
IE 8 Beta 1 |
IE 8.0 |
| :first-letter { sRules } |
:first-letter |
No |
Yes |
Yes |
Yes |
Yes |
Yes |
| :first-line { sRules } |
:first-line |
No |
Yes |
Yes |
Yes |
Yes |
Yes |
CSS 3:
| |
|
IE 5.0 |
IE 5.5 |
IE 6.0 |
IE 7.0 |
IE 8 Beta 1 |
IE 8.0 |
| ::before { sRules } |
::before |
No |
No |
No |
No |
No |
No |
| ::after { sRules } |
::after |
No |
No |
No |
No |
No |
No |
| ::first-letter { sRules } |
::first-letter |
No |
No |
No |
No |
No |
No |
| ::first-line { sRules } |
::first-line |
No |
No |
No |
No |
No |
No |
| ::selection { sRules } |
::selection |
No |
No |
No |
No |
No |
No |
| ::value { sRules } |
::value |
No |
No |
No |
No |
No |
No |
| ::choices { sRules } |
::choices |
No |
No |
No |
No |
No |
No |
| ::repeat-item { sRules } |
::repeat-item |
No |
No |
No |
No |
No |
No |
| ::repeat-index { sRules } |
::repeat-index |
No |
No |
No |
No |
No |
No |
Attributes
CSS 2.1:
| |
|
IE 5.0 |
IE 5.5 |
IE 6.0 |
IE 7.0 |
IE 8 Beta 1 |
IE 8.0 |
| { sRule!important } |
!important Declaration |
Partial |
Partial |
Partial |
Yes |
Yes |
Yes |
Lists
CSS 2.1:
| |
|
IE 5.0 |
IE 5.5 |
IE 6.0 |
IE 7.0 |
IE 8 Beta 1 |
IE 8.0 |
| { list-style : sStyle } |
list-style |
Yes |
Yes |
Yes |
Yes |
Yes |
Yes |
| { list-style-image : sStyle } |
list-style-image |
Yes |
Yes |
Yes |
Yes |
Yes |
Yes |
| { list-style-position : sStyle } |
list-style-position |
Yes |
Yes |
Yes |
Yes |
Yes |
Yes |
| { list-style-type : sStyle } |
list-style-type |
No |
No |
No |
Partial |
Yes |
Yes |
Color and Background
CSS 2.1:
| |
|
IE 5.0 |
IE 5.5 |
IE 6.0 |
IE 7.0 |
IE 8 Beta 1 |
IE 8.0 |
| { color : sColor } |
color |
Yes |
Yes |
Yes |
Yes |
Yes |
Yes |
| { background : sBackground } |
background |
Yes |
Yes |
Yes |
Yes |
Yes |
Yes |
| { background-attachment : sAttachment } |
background-attachment |
Partial |
Partial |
Partial |
Yes |
Yes |
Yes |
| { background-color : sColor } |
background-color |
Yes |
Yes |
Yes |
Yes |
Yes |
Yes |
| { background-image : sLocation } |
background-image |
Yes |
Yes |
Yes |
Yes |
Yes |
Yes |
| { background-position : sPosition } |
background-position |
Partial |
Partial |
Partial |
Partial |
Yes |
Yes |
| { background-repeat : sRepeat } |
background-repeat |
Yes |
Yes |
Yes |
Yes |
Yes |
Yes |
CSS 3:
| |
|
IE 5.0 |
IE 5.5 |
IE 6.0 |
IE 7.0 |
IE 8 Beta 1 |
IE 8.0 |
| { color-profile : sProfile } |
color-profile |
No |
No |
No |
No |
No |
No |
| { rendering-intent : sIntent } |
rendering-intent |
No |
No |
No |
No |
No |
No |
{ background : sBackground1,
sBackground2, etc. } |
background (multiple) |
No |
No |
No |
No |
No |
No |
| { background-clip : sClip } |
background-clip |
No |
No |
No |
No |
No |
No |
| { background-origin : sOrigin } |
background-origin |
No |
No |
No |
No |
No |
No |
| { background-break : sBreak } |
background-break |
No |
No |
No |
No |
No |
No |
| { background-size : sSize } |
background-size |
No |
No |
No |
No |
No |
No |
Font and Text
CSS 2.1:
| |
|
IE 5.0 |
IE 5.5 |
IE 6.0 |
IE 7.0 |
IE 8 Beta 1 |
IE 8.0 |
| { direction : sDirection } |
direction |
Yes |
Yes |
Yes |
Yes |
Yes |
Yes |
| { font : sFont } |
font |
Yes |
Yes |
Yes |
Yes |
Yes |
Yes |
| { font-family : sFamily } |
font-family |
Yes |
Yes |
Yes |
Yes |
Yes |
Yes |
| { font-size : sSize } |
font-size |
Yes |
Yes |
Yes |
Yes |
Yes |
Yes |
| { font-style : sStyle } |
font-style |
Yes |
Yes |
Yes |
Yes |
Yes |
Yes |
| { font-variant : sVariant } |
font-variant |
Yes |
Yes |
Yes |
Yes |
Yes |
Yes |
| { font-weight : sWeight } |
font-weight |
Partial |
Partial |
Partial |
Partial |
Partial |
Yes |
| { letter-spacing : sSpacing } |
letter-spacing |
Yes |
Yes |
Yes |
Yes |
Yes |
Yes |
| { line-height : sHeight } |
line-height |
Yes |
Yes |
Yes |
Yes |
Yes |
Yes |
| { text-align : sAlign } |
text-align |
Yes |
Yes |
Yes |
Yes |
Yes |
Yes |
| { text-decoration : sDecoration } |
text-decoration |
Yes |
Yes |
Yes |
Yes |
Yes |
Yes |
| { text-indent : sIndent } |
text-indent |
Yes |
Yes |
Yes |
Yes |
Yes |
Yes |
| { text-transform : sTransform } |
text-transform |
Yes |
Yes |
Yes |
Yes |
Yes |
Yes |
| { unicode-bidi : sAlign } |
unicode-bidi |
Yes |
Yes |
Yes |
Yes |
Yes |
Yes |
| { vertical-align : sAlign } |
vertical-align |
Yes |
Yes |
Yes |
Yes |
Yes |
Yes |
| { white-space : sWrap } |
white-space |
Partial |
Partial |
Partial |
Partial |
Yes |
Yes |
| { word-spacing : sSpacing } |
word-spacing |
Partial |
Partial |
Partial |
Partial |
No |
Yes |
CSS 3:
| |
|
IE 5.0 |
IE 5.5 |
IE 6.0 |
IE 7.0 |
IE 8 Beta 1 |
IE 8.0 |
| { font-effect : sEffect } |
font-effect |
No |
No |
No |
No |
No |
No |
| { font-emphasize : sEmphasize } |
font-emphasize |
No |
No |
No |
No |
No |
No |
| { font-size-adjust : sSizeAdjust } |
font-size-adjust |
No |
No |
No |
No |
No |
No |
| { font-smooth : sSmooth } |
font-smooth |
No |
No |
No |
No |
No |
No |
| { font-stretch : sStretch } |
font-stretch |
No |
No |
No |
No |
No |
No |
| { hanging-punctuation : sHangingPunctuation } |
hanging-punctuation |
No |
No |
No |
No |
No |
No |
| { punctuation-trim : sTrim } |
punctuation-trim |
No |
No |
No |
No |
No |
No |
| { ruby-align : sRubyAlign } |
ruby-align |
Yes |
Yes |
Yes |
Yes |
No |
Yes |
| { ruby-overhang : sRubyOverhang } |
ruby-overhang |
Yes |
Yes |
Yes |
Yes |
No |
Yes |
| { ruby-position : sRubyPlacement } |
ruby-position |
Yes |
Yes |
Yes |
Yes |
No |
Yes |
| { ruby-span : sRubySpan } |
ruby-span |
No |
No |
No |
No |
No |
No |
| { text-align-last : sAlignLast } |
text-align-last |
Partial |
Partial |
Partial |
Partial |
Partial |
Partial |
| { text-emphasis : sEmphasis } |
text-emphasis |
No |
No |
No |
No |
No |
No |
| { text-justify : sJustify } |
text-justify |
No |
Yes |
Yes |
Yes |
Yes |
Yes |
| { text-outline : sOutline } |
text-outline |
No |
No |
No |
No |
No |
No |
| { text-overflow : sOverflow} |
text-overflow |
No |
Partial |
Partial |
Partial |
Partial |
Partial |
| { text-shadow : sShadow } |
text-shadow |
No |
No |
No |
No |
No |
No |
| { text-wrap : sWrap } |
text-wrap |
No |
No |
No |
No |
No |
No |
| { word-break : sBreak } |
word-break |
Partial |
Partial |
Partial |
Partial |
Partial |
Partial |
| { word-wrap : sWrap } |
word-wrap |
Yes |
Yes |
Yes |
Yes |
Yes |
Yes |
| { writing-mode : sFlow } |
writing-mode |
Yes |
Yes |
Yes |
Yes |
Yes |
Yes |
Generated Content
CSS 2.1:
| |
|
IE 5.0 |
IE 5.5 |
IE 6.0 |
IE 7.0 |
IE 8 Beta 1 |
IE 8.0 |
| { content : sContent } |
content |
No |
No |
No |
No |
Partial |
Yes |
| { counter-increment : sCounter } |
counter-increment |
No |
No |
No |
No |
Partial |
Yes |
| { counter-reset : sCounter } |
counter-reset |
No |
No |
No |
No |
Partial |
Yes |
| { quotes : sQuotes } |
quotes |
No |
No |
No |
No |
No |
Yes |
Border and Layout
CSS 2.1:
| |
|
IE 5.0 |
IE 5.5 |
IE 6.0 |
IE 7.0 |
IE 8 Beta 1 |
IE 8.0 |
| { border : sBorder } |
border |
Yes |
Yes |
Yes |
Yes |
Yes |
Yes |
| { border-bottom : sBottom } |
border-bottom |
No |
Yes |
Yes |
Yes |
Yes |
Yes |
| { border-bottom-color : sColor } |
border-bottom-color |
Yes |
Yes |
Yes |
Yes |
Yes |
Yes |
| { border-bottom-style : sStyle } |
border-bottom-style |
No |
Yes |
Yes |
Yes |
Yes |
Yes |
| { border-bottom-width : sWidth } |
border-bottom-width |
No |
Yes |
Yes |
Yes |
Yes |
Yes |
| { border-collapse : sCollapse } |
border-collapse |
Partial |
Partial |
Partial |
Partial |
Yes |
Yes |
| { border-color : sColor } |
border-color |
Yes |
Yes |
Yes |
Yes |
Yes |
Yes |
| { border-left : sLeft } |
border-left |
No |
Yes |
Yes |
Yes |
Yes |
Yes |
| { border-left-color : sColor } |
border-left-color |
Yes |
Yes |
Yes |
Yes |
Yes |
Yes |
| { border-left-style : sStyle } |
border-left-style |
No |
Yes |
Yes |
Yes |
Yes |
Yes |
| { border-left-width : sWidth } |
border-left-width |
No |
Yes |
Yes |
Yes |
Yes |
Yes |
| { border-right : sRight} |
border-right |
No |
Yes |
Yes |
Yes |
Yes |
Yes |
| { border-right-color : sColor } |
border-right-color |
Yes |
Yes |
Yes |
Yes |
Yes |
Yes |
| { border-right-style : sStyle } |
border-right-style |
No |
Yes |
Yes |
Yes |
Yes |
Yes |
| { border-right-width : sWidth } |
border-right-width |
No |
Yes |
Yes |
Yes |
Yes |
Yes |
| { border-spacing : sSpacing } |
border-spacing |
No |
No |
No |
No |
Yes |
Yes |
| { border-style : sStyle } |
border-style |
No |
Partial |
Partial |
Partial |
Yes |
Yes |
| { border-top : sTop } |
border-top |
No |
Yes |
Yes |
Yes |
Yes |
Yes |
| { border-top-color : sColor } |
border-top-color |
Yes |
Yes |
Yes |
Yes |
Yes |
Yes |
| { border-top-style : sStyle } |
border-top-style |
No |
Yes |
Yes |
Yes |
Yes |
Yes |
| { border-top-width : sWidth } |
border-top-width |
No |
Yes |
Yes |
Yes |
Yes |
Yes |
| { border-width : sWidth } |
border-width |
Yes |
Yes |
Yes |
Yes |
Yes |
Yes |
| { caption-side : sLocation } |
caption-side |
No |
No |
No |
No |
Yes |
Yes |
| { clear : sClear } |
clear |
Yes |
Yes |
Yes |
Yes |
Yes |
Yes |
| { empty-cells : sEmptyCells } |
empty-cells |
No |
No |
No |
Partial |
Partial |
Yes |
| { float : sFloat } |
float |
Yes |
Yes |
Yes |
Yes |
Yes |
Yes |
| { margin : sMargin } |
margin |
Yes |
Yes |
Yes |
Yes |
Yes |
Yes |
| { margin-bottom : sHeight } |
margin-bottom |
Yes |
Yes |
Yes |
Yes |
Yes |
Yes |
| { margin-left : sWidth } |
margin-left |
Yes |
Yes |
Yes |
Yes |
Yes |
Yes |
| { margin-right : sWidth } |
margin-right |
Yes |
Yes |
Yes |
Yes |
Yes |
Yes |
| { margin-top : sHeight } |
margin-top |
Yes |
Yes |
Yes |
Yes |
Yes |
Yes |
| { padding : sPadding } |
|