Shulou(Shulou.com)06/02 Report--

This article shows you how CSS HACK distinguishes the compatibility of IE6, IE7, IE8 and Firefox. The content is concise and easy to understand. It will definitely brighten your eyes. I hope you can get something through the detailed introduction of this article.

Describe how to use CSS HACK to distinguish between IE6, IE7, IE8, and Firefox compatibility issues.

CSS HACK distinguishes the compatibility of IE6, IE7, IE8 and Firefox

1. Distinguish between IE and non-IE browsers

# tip {background:blue;/* non-IE background color * / background:red\ 9 * / IE8 background color * /}

two。 Distinguishing IE6,IE7,IE8,FF

[distinguishing symbol]: "\ 9", "*", "_"

[example]:

# tip {the background:blue;/*Firefox background turns blue * / background:red\ 9 switch the IE8 background becomes red * / * the background:black;/*IE7 background changes to black * / _ background:orange;/*IE6 background changes to orange * /}

[description]: because IE browsers can read "\ 9", while IE6 and IE7 can read "*" (meter font), and IE6 can recognize "_" (bottom line), it can be written down in order, so that browsers can read it correctly and understand CSS syntax, so they can effectively distinguish between IE versions and non-IE browsers (such as Firefox, Opera, GoogleChrome, Safari, etc.).

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

[distinguishing symbol]: "*", "_"

[example]:

# tip {background:blue;/*Firefox background becomes blue * / * background:black;/*IE7 background changes to black * / _ background:orange;/*IE6 background changes to orange * /}

[description]: IE7 and IE6 can read "*" (meter font), IE6 can read "_" (bottom line), but IE7 can not read "_", and Firefox (non-IE browser) can not recognize "*" and "_" at all, so IE6, IE7 and Firefox can be distinguished by such differences.

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

[distinguishing symbol]: "*", "! important"

[example]:

# tip {background:blue;/*Firefox background turns blue * / * background:orange;/*IE6 background changes to orange * /

[description]: IE7 can identify "*" and "! important", but IE6 can only identify "*" but not "! important". As for Firefox, it can read "! important" but cannot recognize "*" so it can effectively distinguish IE6, IE7 and Firefox through such differences.

5. Distinguish between IE7 and Firefox

[distinguishing symbol]: "*", "! important"

[example]:

# tip {the background of background:blue;/*Firefox turns blue * / * the background turns green * /}

[description]: because Firefox can recognize "! important" but not "*", while IE7 can understand "*" and "! important" at the same time, two identifiers can distinguish IE7 from Firefox.

6. Distinguish between IE6 and IE7 (method 1)

[distinguishing symbol]: "*", "_"

[example]:

# tip {* background:black;/*IE7 background changes to black * / _ background:orange;/*IE6 background changes to orange * /}

[description]: both IE7 and IE6 can identify "*" (meter font), but IE6 can identify "_" (bottom line), but IE7 can not. The difference between IE6 and IE7 can be easily distinguished by the fact that IE7 cannot read "_".

7. Distinguish between IE6 and IE7 (method 2)

[distinguishing symbol]: "! important"

[example]:

# tip {backgroundglug blackening importantanspact IE7 background becomes black * / background:orange;/*IE6 background changes to orange * /}

[description]: because IE7 can read "! important;" but not IE6, and the reading step of CSS is from top to bottom, IE6 can not recognize "! important" and skip to the next line to read CSS, so the background color will appear orange.

8. Distinguish between IE6 and Firefox

[distinguishing symbol]: "_"

[example]:

# tip {background:black;/*Firefox background changes to black * / _ background:orange;/*IE6 background changes to orange * /}

[description]: because IE6 can identify "_" (bottom line), but Firefox is not, it can distinguish between Firefox and IE6 through such differences, and effectively achieve CSShack.

The above is how CSS HACK distinguishes IE6, IE7, IE8, and Firefox compatibility. Have you learned any knowledge or skills? If you want to learn more skills or enrich your knowledge reserve, you are welcome to follow the industry information channel.

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.