Compatibility of IE6, IE7, IE8, ie9, and Firefox

1. Differences between IE and non-ie browsers
# Tip {
Background: Blue;/* Non-ie background colors */
Background: Red \ 9;/* IE6, IE7, and IE8 background colors */
Background-color: Red \ 0;/* Internet Explorer 8/9 */
Background-color: Blue \ 9 \ 0;/* ie 9 */
}

2. Differences between IE6, IE7, IE8, and FF

[Difference]: "\ 9", "*", "_", and "\ 0 」
[Example ]:
# Tip {
Background: Blue;/* the Firefox background turns blue */
Background-color: Red \ 0;/* ie 8/9 * // * The IE8 background turns red */
Background-color: yellow \ 9 \ 0;/* ie 9 * // * ie9 background turns yellow */
* Background: black;/* The IE7 background turns black */
_ Background: orange;/* change the IE6 background to orange */
}
[Note]: Internet Explorer series can read "\ 9", Internet Explorer 6 and Internet Explorer 7 can read "*" (in meters), and Internet Explorer 6 can recognize "_" (bottom line ), therefore, you can write it down in order, so that the browser can read the CSS syntax correctly, therefore, you can effectively distinguish ie versions from non-ie browsers (such as Firefox, opera, Google Chrome, and Safari ).

3. Differences between IE6, IE7, and Firefox (method 1)

[Difference]: "*" and ]:「*」,「_」
[Example ]:
# Tip {
Background: Blue;/* the Firefox background turns blue */
* Background: black;/* The IE7 background turns black */
_ Background: orange;/* change the IE6 background to orange */
}
[Note]: IE7 and IE6 can read "*", while IE6 can read "_" (bottom line), but IE7 cannot read 「_」, firefox (non-ie browsers) cannot identify "*" or "_" at all. Therefore, we can distinguish IE6, IE7, and Firefox through such differences.

4. Differences between IE6, IE7, and Firefox (method 2)

[Difference symbol ]:「*」,「! Important 」
[Example ]:
# Tip {
Background: Blue;/* the Firefox background turns blue */
* Background: Green! Important;/* The IE7 background turns green */
* Background: orange;/* The IE6 background changes to orange */
}
[Note]: IE7 can identify "*" and 「! Important, but IE6 can only recognize "*", but cannot recognize 「! Important. Firefox can read 「! Important ", but cannot identify" * ". Therefore, we can effectively distinguish IE6, IE7, and Firefox by using these differences.

5. Differences between IE7 and Firefox

[Difference symbol ]:「*」,「! Important 」
[Example ]:
# Tip {
Background: Blue;/* the Firefox background turns blue */
* Background: Green! Important;/* The IE7 background turns green */
}
[Note]: Firefox can recognize 「! Important, but cannot identify "*", while IE7 can understand "*" and "!" at the same time 「*」,「! Important ", because there are two identifiers to separate IE7 and Firefox.

6. Differences between IE6 and IE7 (method 1)

[Difference]: "*" and ]:「*」,「_」
[Example ]:
# Tip {
* Background: black;/* The IE7 background turns black */
_ Background: orange;/* change the IE6 background to orange */
}
[Note]: Both IE7 and IE6 can recognize "*", but IE6 can recognize "_" (bottom line), but IE7 cannot, the difference between IE6 and IE7 can be easily separated by the feature that IE7 cannot read.

7. Differences between IE6 and IE7 (method 2)

[Difference symbol ]:「! Important 」
[Example ]:
# Tip {
Background: Black! Important;/* The IE7 background turns black */
Background: orange;/* change the background of IE6 to orange */
}
[Note]: Because IE7 can read 「! Important; "but IE6 does not work, and the CSS read step is from top to bottom. Therefore, IE6 cannot be recognized when reading 「! Important directly jumps to the next line to read CSS, so the background color is orange.

8. Differences between IE6 and Firefox

[Difference symbol ]:「_」
[Example ]:
# Tip {
Background: black;/* the Firefox background turns black */
_ Background: orange;/* change the IE6 background to orange */
}
[Note]: IE6 can recognize "_" (bottom line), but Firefox cannot. Therefore, Firefox and IE6 can be separated by such differences to effectively achieve CSS hack.

9. Differences between IE8 and ie9

In general, when we write a better structure, there is no difference in IE8/9, so few people may pay attention to CSS hack that only IE8 or ie9 knows.

IE8 and earlier versions do not support css3, but if we use css3, ie9 can be rendered normally under IE, but we want IE8 and earlier browsers to achieve the same effect, if you do not want to use methods such as css3pie or HTC or conditional annotation, you may need to use the exclusive CSS hack of IE8 and ie9.

. Test {color: # 09f \ 0;/* IE8/9 */color: # 09f \ 0/;/* IE8 only */}: Root. test {color: #963 \ 9;}/* ie9 only * // * or below, but the following priority is smaller than the above.