Explanation of private conditions in IE browser in HTML

In the process of learning and applying standard web pages, the compatibility of web pages with browsers is a common problem. Among them, Microsoft Internet Explorer (IE) occupies more than half of the browser market, in addition to Firefox and opera. These browsers must be compatible.
At the same time, for IE alone, due to the replacement of the IE version, viewers currently use ie5 (ie5.5), IE6, and IE7. The three versions display different interpretations of the standard web page (XHTML + CSS. In addition, other non-ie browsers and IE have different interpretations of some CSS. Therefore, you can use the proprietary condition annotations in IE browser to define relevant attributes.
Address: http://www.quirksmode.org/css/condcom.html
Condition annotations can only be used for Explorer 5 + windows (IE) (condition annotations are supported from ie5 ). If you have installed Multiple ie, the conditional comments will be based on IE of the highest version (ie 7 is currently used ).
Conditional annotations can only be used in Windows Internet Explorer (IE). Therefore, you can add special commands for IE by using conditional annotations.
In layman's terms, condition comments are some if judgments, but these judgments are not executed in scripts, but directly in HTML Code For example:

<! -- [If IE]>
Here is the normal HTML code
<! [Endif] -->

1. Basic Structure of condition annotations and HTML annotations (<! -->) Is the same. Therefore, browsers other than IE will regard them as common comments and ignore them completely.
2. ie will determine whether to parse the content in the condition comment just like the normal page content based on the if condition.
3. Conditional annotations use the HTML annotation structure. Therefore, they can only be used in HTML files, not CSS files.
You can use the following code to check the current version of IE (Note: it is ineffective in non-ie browsers)
<! -- [If IE]>
<H1> you are using IE <! -- [If IE 5]>
<H2> Version 5 </H2>
<! [Endif] -->
<! -- [If IE 5.0]>
<H2> Version 5.0 </H2>
<! [Endif] -->
<! -- [If IE 5.5]>
<H2> Version 5.5 </H2>
<! [Endif] -->
<! -- [If IE 6]>
<H2> Version 6 </H2>
<! [Endif] -->
<! -- [If IE 7]>
<H2> Version 7 </H2>
<! [Endif] -->
<! [Endif] -->

If the current browser is ie but the version is lower than ie5, what should I do? You can use it <! -- [If ls ie 5]>, of course, the condition annotation can only be in ie5 + environment, so <! -- [If ls ie 5]> is not executed at all.

LTE: Short for less than or equal to, that is, less than or equal.
LT: Short for less than, that is, less.
GTE: Short for greater than or equal to, that is, greater than or equal.
GT: Short for greater than, that is, greater.
! : It means not equal to, which is the same as the non-equal identifier in JavaScript.

Conditional comments belong to CSS hack? Does the condition determination belong to CSS hack?
Strictly speaking, it belongs to CSS hack. Because it is like other real CSS hack, it allows us to assign special styles to Some browsers, and then it does not rely on a browser bug to control another browser (style ). In addition, condition determination can also be used to do things beyond the CSS hack range (although this rarely happens ).
Because conditional judgment does not rely on a browser's hack, it is a well-thought-out feature, so I believe it can be safely used. Of course, other browsers may also support conditional judgment (not available so far), but it seems that they should not use such as <! -- [If IE]> syntax.
How to Apply conditional comments
This article explains at the beginning, because browsers of different ie versions have different interpretations of the Web standard pages we have created. Specifically, they have different interpretations of CSS. To be compatible with these, you can use condition annotations to define them separately to achieve compatibility. For example:

<! -- First use the css.css style sheet -->
<LINK rel = "stylesheet" type = "text/CSS" href = "css.css"/>
<! -- [If IE 7]>
<! -- If the iebrowser version is "7", use the ie7.css style sheet. -->
<LINK rel = "stylesheet" type = "text/CSS" href = "ie7.css"/>
<! [Endif] -->
<! -- [If lte ie 6]>
<! -- If the IE browser is smaller than or equal to 6, use the ie.css style sheet. -->
<LINK rel = "stylesheet" type = "text/CSS" href = "ie.css"/>
<! [Endif] -->

This differentiates the implementation of CSS by IE7 and IE6 to achieve compatibility. At the same time, the first line of CSS is compatible with other non-ie browsers.
Note: The default CSS style should be located at the first line of the HTML document. All the content for condition annotation judgment must be located after the default style.
For example, if the following code is executed in IE, it is displayed in red, but not in IE. If the condition annotation judgment is placed on the first line, it cannot be implemented. This example shows how to solve the compatibility problem between the web browser and the Internet Explorer.
<Style type = "text/CSS">
Body {
Background-color: #000;
}
</Style>
<! -- [If IE]>
<Style type = "text/CSS">
Body {
Background-color: # f00;
}
</Style>
<! [Endif] -->

at the same time, someone will try to use it to define non-IE browser conditions, but note: Condition comments can only be executed in IE browser. This code is not executed in non-IE browser, but not in non-IE browser, it turns a blind eye to it as a comment.
normally, it is the default style. If you need special processing on IE browser, you must make a conditional comment.