Use X-UA-compatible to set the IE8 compatibility mode

Source: Internet
Author: User
Tags website server
Http://www.cnblogs.com/libra/archive/2009/03/24/1420731.html
Http://msdn.microsoft.com/en-us/library/cc288325 (vs.85). aspx.

File compatibility is used to define how IE can compile your webpage. This file explains file compatibility, how to specify the file compatibility mode of your website, and how to determine the file mode that a webpage uses.

Preface

To help ensure that your web pages have consistent appearances in all future ie versions, IE8 introduces file compatibility. Introduce an additional compatibility mode in IE6. file compatibility enables you to select a specific compilation mode when ie presents Your webpage.
The new ie introduces file compatibility in order to ensure that the webpage will have an appearance in future versions. When you introduce an additional compatibility mode,
ThisArticleDescribes the necessity of file compatibility, lists the file compatibility modes available for existing ie versions, and demonstrates how to select a specific compatibility mode.

Understand the necessity of file compatibility

The new features of IE in each major version are designed to make browsers easier to use, increase security, and support industry standards. One of the risks is that the old version of the website cannot be correctly displayed.

To minimize this risk, IE6 allows web developers to select IE to compile and display their web pages. "Quirks mode" is a preset, which will display the page at the viewpoint of an earlier version of the browser. "standards mode" (also known as "strict mode") is the most well-developed standard in the industry. However, to use this enhanced support function, the webpage must contain an appropriate <! Doctype> command.

If a webpage does not contain<! Doctype>Command, IE6 will display it in quirks mode. If the webpage contains valid<! Doctype>The command is not recognized by the browser. IE6 displays it in IE6 standards mode. Because a few websites already contain<! Doctype>Command. The compatibility mode is successfully switched. This allows web developers to choose the best time to move their web pages to standards mode.

As time passes, more websites begin to use the standards mode. They also began to use IE6 features and functions to detect IE. For example, IE6 does not support the universal selector (the Global selector of CSS * {}), so some websites use it to make specific correspondence for IE.

When IE7 supports the global selector, websites that depend on IE6 cannot detect this new version of browsers. Therefore, the specific correspondence for IE cannot be applied to IE7, and these websites cannot be displayed as expected. Because<! Doctype>Only two compatibility modes are supported. Affected website owners are forced to update their websites so that they can support ie7.

IE8 supports industry standards more than any previous version of browsers, so web pages designed for earlier versions of browsers may not be displayed as expected. To help alleviate all problems, IE8 introduces the file compatibility concept so that you can select the specific IE version for Your webpage design. New file compatibility modes are added in IE8, which tell the browser how to parse and compile a Web page. If your webpage cannot be correctly displayed on IE8, you can update your website to support the latest webpage standard (priority) or add a meta element on your page to tell IE8 how to compile your page according to the old browser version.

This allows you to choose to update your website to support the new features of IE8.

Understanding file compatibility mode

IE8 supports several file compatibility modes, which have different features and affect the way the content is displayed.

• Emulate IE8 mode indicates ie usage<! Doctype>Command to determine how to compile the content. The standards mode command is displayed as IE8 standards mode, and the quirks mode is displayed as ie5 mode. Unlike IE8 mode, emulate IE8 Mode<! Doctype>Command.
• Emulate IE7 mode indicates ie usage<! Doctype>Command to determine how to compile the content. The standards mode command is displayed as IE7 standards mode and the quirks mode is displayed as ie5 mode. Unlike IE7 mode, emulate IE7 Mode<! Doctype>Command. This is the most recommended compatibility mode for many web pages.
• The content compiled by ie5 mode is similar to the display of IE7 quirks mode, which is similar to that displayed in ie5.
• The content compiled by IE7 mode is like the display of IE7 standards mode, regardless of whether the webpage contains<! Doctype>Command.
• IE8 mode provides the highest support for industry standards, including W3C Cascading Style Sheets level 2.1 specification and W3C selectors APIs, and limited support for W3C Cascading Style Sheets Level 3 specification (working draft ).
• Edge mode indicates that IE displays content in the currently available highest mode. When IE8 is used, it is equivalent to IE8 mode. If (assuming) IE that supports higher compatibility mode will be released in the future, pages that use edge mode will use the highest mode supported by this version to display the content. The same pages will still be displayed as usual when you use IE8 for browsing.

Edge mode uses the highest mode supported by this IE version to display the content of the browser webpage. We recommend that you use only the test page and other non-commercial pages.

File compatibility mode

To specify the file mode for Your webpage, you must useMetaAdd the element to the X-UA-compatible http-equiv header. The following is an example of emulate IE7 mode compatibility.

 

< Html >
< Head >
<! -- Mimic Internet Explorer 7 -->
< Meta HTTP-equiv = "X-UA-compatible" Content = "Ie = emulateie7"   />
< Title > My web page </ Title >
</ Head >
< Body >
< P > Content goes here. </ P >
</ Body >
</ Html >  

Its content changes with the specified page mode. To simulate IE7, specifyIe = emulateie7, SpecifyIe = 5,Ie = 7, OrIe = 8To select a compatibility mode. You can also specifyIe = edgeTo indicate that IE8 uses the highest mode it supports.

The X-UA-compatible header is case-insensitive. However, apart from the title Element and ItsMetaIt must appear before other elements in the header section of the webpage,

Set the website server to specify the default compatibility mode

Website administrators can define a custom header for a website to preset a specific file compatibility mode for their website. This specific method depends on your website server. For example, the following web. config file enables Microsoft Internet Information Services (IIS) to define a custom header to automatically use IE7 mode to compile all web pages.

 

<? XML version = "1.0" encoding = "UTF-8" ?>
< Configuration >
< System. Webserver >
< Httpprotocol >
< Customheaders >
< Clear />
< Add Name = "X-UA-compatible" Value = "Ie = emulateie7"   />
</ Customheaders >
</ Httpprotocol >
</ System. Webserver >
</ Configuration >  

If you have specified a preset file compatibility mode on the website server, you can specify different file compatibility modes on individual pages to overwrite it. The pattern priority specified on the webpage is higher than the pattern specified on the server.

Please refer to the information on your website server about specifying custom headers, or for more information:

Implementing the meta switch on Apache
Implementing the meta switch on IIS

Determine file compatibility mode

To determine the file compatibility mode when a webpage uses IE8, use the documentmode function of Document Object. For example, enter the following code in the IE8 URL column to display the file mode on the current page.

Javascript: alert(document.doc umentmode );

 

DocumentmodeThe function returns a value corresponding to the file compatibility mode of the current page. For example, if the webpage is specified to support IE8 mode,DocumentmodeThe return value"8".

The compatmode function introduced in IE6 does not supportDocumentmodeFunction. Currently usedCompatmodeThe created applications can also work in IE8, but they must be updated to use documentmode.

If you want to use JavaScript to determine the compatibility mode of a file, the Code introduced in the following example can support the earlier version of IE.

 

Engine =   Null ;
If (Window. Navigator. appname =   " Microsoft Internet Explorer " )
{
// This is an IE browser. What mode is the engine in?
If (Document.doc umentmode) // IE8
Engine = Document.doc umentmode;
Else   // IE 5-7
{
Engine =   5 ; // Assume quirks mode unless proven otherwise
If (Document. compatmode)
{
If (Document. compatmode =   " Css1compat " )
Engine =   7 ; // Standards Mode
}
}
// The Engine Variable now contains the document compatibility mode.
}

 

 

Recognize content attribute values

The content property value is flexible when receiving a value different from the previously described value. This gives you more control over how IE displays your webpage. For example, you can set the content property value to IE = 7.5. When you do this, ie tries to convert the value to version vector and select the closest result. In this example, ie sets it to IE7 mode. The following example shows how this mode is set to another value.

 

< Meta HTTP-equiv = "X-UA-compatible" Content = "Ie = 4" > <! -- Ie5 Mode -->
< Meta HTTP-equiv = "X-UA-compatible" Content = "Ie= 7.5" >   <! -- IE7 Mode -->
< Meta HTTP-equiv = "X-UA-compatible" Content = "Ie= 100" >   <! -- IE8 Mode -->
< Meta HTTP-equiv = "X-UA-compatible" Content = "Ie =" > <! -- Ie5 Mode -->

<! --This header mimics Internet Explorer 7 and uses
<! Doctype> to determine how to display the web page-->
<MetaHTTP-equiv= "X-UA-compatible"Content= "Ie = emulateie7">

Note:The preceding example shows a separate content value. In fact, ie Only executes the first X-UA-compatible header on the webpage.

You can also use the content attribute to specify the compatibility mode of the complex file. This helps ensure that your web page will be displayed in a consistent manner in future browser versions. To set the file mode of the plural number, set the content attribute to identify the mode you want to use. Use semicolons to separate modes.

If a specific version of IE supports more than one compatibility mode, use the most available mode listed in the header content attribute. You can use this feature to exclude specific compatibility modes, although this is not recommended. For example, the following header will exclude IE7 mode.

< Meta HTTP-equiv = "X-UA-compatible" Content = "Ie = 5; Ie = 8"   />

 

 

Conclusion

Compatibility is an important concern for web designers. Although it is best to create a website that does not depend on any web browser features or functions, sometimes this is impossible. In file compatibility mode, the webpage can be restricted to IE of a specific version.

Use the X-UA-compatible header to specify the IE version supported by your page. UseDocument.doc umentmodeDetermine the page compatibility mode.

If you select IE to support a specific version, you can ensure that your page will be consistent in future browser versions.

Related Article

E-Commerce Solutions

Leverage the same tools powering the Alibaba Ecosystem

Learn more >

Apsara Conference 2019

The Rise of Data Intelligence, September 25th - 27th, Hangzhou, China

Learn more >

Alibaba Cloud Free Trial

Learn and experience the power of Alibaba Cloud with a free trial worth $300-1200 USD

Learn more >

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.