IE conditional comments in HTML

Source: Internet
Author: User
Tags html comment

The IE conditional comment is a special HTML comment that can only be understood by IE5.0 and later. For example, ordinary HTML annotations are:

<!--this is a comment-->

And only IE-readable IE conditional annotations are:

<!--[if ie]> <! [endif]-->

"Non-IE conditional comment":

<!--[if! ie]>--> Non-ie HTML Code <!--<! [endif]-->

"Non-specific version of IE conditional comment" (rarely used):

<!--[if! LT IE 7]><! [ignore[--><![ Ignore[]]>code for browsers that match the IF condition<!--<! [endif]-->

In short, all browsers except "IE on Windows" will assume that conditional annotations are just plain HTML comments. You cannot use conditional annotations in CSS code. IE conditional comment is very useful for IE hide or show specific code method, compared to in the CSS with strange _/manufacturing bug, using IE conditional comments to write CSS "hacks" is a more reasonable method. Popular point, conditional annotations are some if judgments, but these judgments are not executed in the script, but are executed directly in the HTML code.

    1. The basic structure of the conditional comment is the same as the HTML comment (<!––>). Browsers outside of IE will therefore treat them as plain annotations and ignore them entirely.
    2. IE will determine whether the content in the conditional comment is parsed as if the normal page content is parsed, based on the IF condition.
    3. Conditional annotations Use HTML annotation structures, so they can only be used in HTML files and not in CSS files.

Syntactically, this is a fairly legitimate common HTML comment. Any browser will assume that the part between <!– and –> is a comment and ignores it. But IE will also see where [if ie]> and start explaining the next code until it encounters <! [EndIf]. Therefore, the following code will not be displayed in any other browser face.

The "comparison operator" gives you more flexibility to control the version of IE by adding "comparison operators" in front of IE. The legal operators are as follows:

    • LTE: is less than or equal to the shorthand, that is, smaller than or equal to the meaning.
    • LT: is less than shorthand, that is, smaller than the meaning.
    • GTE: is greater than or equal to the shorthand, that is, greater than or equal to the meaning.
    • GT: is greater than shorthand, that is, the meaning of greater than.
    • ! : Is not equal to the meaning of the JavaScript is not equal to the same judge

Example:

    • <!–[if GT ie 5.5]>/If IE version is greater than 5.5/
    • <!–[if LTE IE 6]>/if IE version is less than or equal to 6/
    • <!–[if! ie]>/If the browser is not IE/

While it may seem more time consuming to use conditional annotations for the first time, you'll find it handy when you debug your CSS later. With conditional annotations You only need to write the HTML comment once, and with the bug you need to write a long, ugly code for each rule, and often it is written to change other hacks hacks. Otherwise, the conditional comment is a valid HTML comment for any browser that does not support it. Here are some of the differences between conditional annotations and CSS hacks:

    1. Hacks are browser-based bugs that may eventually be fixed.
    2. Conditional comments are based on IE specific code, and this recognition mechanism is not removed at any time.
    3. Every browser can see your hacks, maybe the next version or a new browser will make an error on your hacks code.
    4. Only IE can see the conditional comment, through the additional "IE file" to affect the page, other browsers will not download it at all.
    5. Hacks doesn't make sure which browsers are in effect and which ones are not, and the more hacks you use, the more confusing your code is.
    6. Conditional annotations Take advantage of version matching to make it easy for authors to write code to a specific version

IE conditional comments in HTML

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.