Browsers force our web page to be displayed in IE7 document mode

Source: Internet
Author: User
Tags iis versions website server

Sometimes, because of the browser's problem, what we develop in IE7 needs to be shown in IE9.

However, there are compatibility issues.

Then we can use the same technique to force the user-side browser to display our web page in IE7 document mode.

The following is for the IIS asp.net program!

1. Add in each page that needs to be added

<meta http-equiv= "x-ua-compatible" content= "Ie=emulateie7"/>
<title>
<%= configurationsettings.appsettings["Systemtitle"]%>
</title>

But if you want the page to be a lot of cases it hurts.

Directly configured in ISS

Configuration is also required in Web.cinfig


<system.webServer>
<customHeaders>
<clear/>
<add name= "x-ua-compatible" value= "Ie=emulateie7"/>
</customHeaders>
</system.webServer>

File compatibility is used to define how you want IE to compile your Web page. This file explains file compatibility, how to specify the file compatibility mode for your site, and how to determine which file mode to use for a Web page.


Objective

To help ensure that your Web page has a consistent look in all future IE versions, IE8 introduces file compatibility. Introducing an additional compatibility mode in IE6, file compatibility allows you to choose a specific compilation mode when IE renders your Web page.
New IE to ensure that the Web page in a future version of a look, IE8 introduced file compatibility. When you introduce an additional compatibility mode,
This article describes the need for file compatibility, lists the file compatibility modes available to existing versions of IE and demonstrates how to select a specific compatibility mode.


Understanding the need for file compatibility

Each major version of IE's new features are designed to make browsers easier to use, increase security, and support industry standards. One of the risks with these features as IE is that older versions of Web sites do not display correctly.

To minimize this risk, IE6 allows Web developers to choose how IE compiles and displays their Web pages. "Quirks mode" is a preset, which makes the page appear as an older version of the browser, and "Standards Mode" (also known as "strict Mode") is characterized by support for the most complete industry standards. However, to take advantage of this enhanced support function, the Web page must contain the appropriate <! doctype> instructions.

If a page does not contain <! doctype> instruction, IE6 will display it in quirks mode. If the page contains valid <! doctype> instruction But the browser is not recognizable, IE6 will display it in IE6 standards mode. Because a few sites already contain <! doctype> instructions, the compatibility mode switch is quite successful. This allows web developers to choose the best time to transfer their pages to standards mode.

More sites are starting to use standards mode as time passes. They are also starting to use IE6 features and features to detect ie. For example, IE6 does not support universal selector (the CSS global selector * {}), and some sites use it to make specific correspondence for IE.

When IE7 adds support for global selectors, sites that rely on IE6 features will not be able to detect this new version of the browser. Therefore, the specific corresponding to IE can not be applied to IE7, resulting in these sites will not be as they expected to display. Because <! Doctype> only supports two compatibility modes, and affected site owners are forced to update their sites to support IE7.

IE8 has more support for industry standards than any previous version of browsers, so web pages designed for older browsers may not be as expected. To help mitigate all problems, IE8 introduces the concept of file compatibility so that you can choose the specific IE version of your web design to correspond to. File compatibility adds new patterns to the IE8 that tell the browser how to parse and compile a Web page. If your Web page doesn't display correctly in IE8, you can update your site to support the latest page standards (preferences) or add a META element to your page to tell IE8 how to compile your page according to an older version of the browser.

This allows you to choose the time to update your site to support IE8 new features.


Understanding file Compatibility Mode

IE8 supports several file compatibility modes that have different characteristics and affect how content is displayed.

Emulate IE8 mode instructs IE to use <! doctype> directives to determine how content is compiled. The standards mode instruction is displayed as IE8 standards mode and quirks mode is displayed as IE5 mode. Different from the IE8 mode,emulate IE8 mode attention <! doctype> instructions.
Emulate IE7 mode instructs IE to use <! doctype> directives to determine how content is compiled. The standards mode instruction is displayed as IE7 standards mode and quirks mode is displayed as IE5 mode. Different from the IE7 mode,emulate IE7 mode attention <! doctype> instructions. This is the most recommended compatibility mode for many Web pages.
IE5 mode compiles content as it does in IE7 quirks mode, and is very similar to what is shown in IE5.
IE7 mode compiles content as shown in IE7 standards mode, whether or not the page contains <! doctype> instructions.
IE8 mode provides the highest support for industry standards, including the cascading style Sheets Level 2.1 specification and the selectors API, and the limited support of the consortium cascading style Sh EETs Level 3 Specification (Working Draft).
Edge mode instructs IE to display content in the highest mode currently available. It is equivalent to IE8 mode when using IE8. If, in the future, IE is released to support a higher compatibility mode, the page using edge mode displays the content in the highest mode that the version can support. The same pages are still displayed as usual when using IE8 browsing.

Because edge mode uses the highest mode that the IE version can support to display the content of the Web page being browsed, it is recommended that it be used only for test pages and other non-commercial pages.


Specify file compatibility mode

To specify the file mode for your Web page, you need to use META elements in your Web page to put x-ua-compatible http-equiv headers. The following is the example specified as emulate IE7 mode compatibility.

<!--Mimic Internet Explorer 7-->
<meta http-equiv= "x-ua-compatible" content= "Ie=emulateie7"/>
<title>my Web page</title>
<body>
<p>content goes here.</p>
</body>

The content changes with the specified page pattern and when you want to simulate IE7, specify IE=EMULATEIE7, specify Ie=5, ie=7, or ie=8 to select one of the compatibility modes. You can also specify Ie=edge to instruct the IE8 to use the highest mode it supports.

X-ua-compatible headers are not case-insensitive. However, in addition to the title element and other meta elements, it must appear before the other elements in the header section of the page,


Set up a Web server to specify a preset compatibility mode

Site administrators can define a custom header for the site to preset a specific file compatibility mode for their site. This particular approach depends on your Web server. For example, the following Web.config files enable 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>
<customHeaders>
<clear/>
<add name= "x-ua-compatible" value= "Ie=emulateie7"/>
</customHeaders>
</system.webServer>
</configuration>

If you have specified a preset file compatibility mode on the Web server, you can specify a different file compatibility mode on individual pages to cover it. The schema specified in the Web page has precedence over the mode specified in the server.

Please refer to your website server for information about designating a custom header, or read more:

Implementing the META Switch on Apache
Implementing the META Switch on IIS


Determine file compatibility mode

To determine the file compatibility mode for Web pages using IE8 browsing, use the Documentmode feature of the Document object. For example, entering the following code in the URL column of IE8 displays the file mode of the current page.

Javascript:alert (Document.documentmode);

Documentmode function will return a value corresponding to the current page file compatibility mode, for example, if the page is designated as supporting IE8 mode, Documentmode will return the value "8".

The Compatmode feature introduced in IE6 does not support the Documentmode features introduced in IE8. Applications that are currently built using Compatmode can also function in IE8, but they must be updated to use Documentmode.

If you want to use JavaScript to determine the compatibility mode of a file, this code that introduces the example below can support older versions of IE.

engine = NULL;
if (Window.navigator.appName = = "Microsoft Internet Explorer")
{
This is a IE browser. What mode is the engine in?
if (Document.documentmode)//IE8
engine = Document.documentmode;
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.
}

Understanding Content Attribute Values

The Content property value is flexible when it receives a value that is different from the previous description. This will give you more control over how IE displays your Web page. For example, you can set the content attribute 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 will set it to IE7 mode. The following example shows a situation where the pattern is set to a different 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=a" > <!--IE5 mode-->

<!--this header mimics Internet Explorer 7 and uses
<! Doctype> to determine you to display the Web page-->
<meta http-equiv= "x-ua-compatible" content= "Ie=emulateie7" > Note: The previous example shows a separate content value. In fact, IE only executes the first x-ua-compatible header in the Web page.

You can also use content attributes to specify the file compatibility mode for complex numbers, which can help ensure that your Web pages are displayed consistently in future browser versions. To set the plural file mode, set the content attribute to identify the pattern you want to use. Use semicolons to separate each mode.

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

<meta http-equiv= "x-ua-compatible" content= "ie=5; Ie=8 "/>

Conclusion

Compatibility is a very important concern for web designers. Although it is best to build a Web site that does not rely on any Web browser features or functionality at all, it is sometimes impossible to achieve. File compatibility mode restricts the Web page to a specific version of IE.

Use the x-ua-compatible header to specify the IE version supported by your page. Use Document.documentmode to determine the compatibility mode for the page.

Choose to support a specific version of IE, you can ensure that your page in the future browser version can also be consistent with the display

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.