谈 X-UA-Compatible 兼容模式

如何理解 IE 的文档兼容模式(X-UA-Compatible)?

IE 浏览器支持多种文档兼容模式,得以因此改变页面的渲染效果。

IE9 模式支持全范围的既定行业标准,包括 HTML5(草案), W3C CSS Level 3 规范(草案), SVG 1.0 规范等

<meta http-equiv="X-UA-Compatible" content="IE=9">

IE8 模式支持许多既定行业标准,W3C CSS Level 2.1 规范和 W3C Selectors API,有限支持 W3C CSS Level 3 规范(草案)和其他行业标准

<meta http-equiv="X-UA-Compatible" content="IE=8">

IE7 模式强制浏览器按照 IE 7 标准模式渲染文档,忽略是否定义指令

<meta http-equiv="X-UA-Compatible" content="IE=7">

Emulate IE9 模式告诉 IE 使用指令来决定如果渲染文档。标准模式下以 IE9 渲染,怪癖模式下以 IE5 渲染。和 IE9 模式不同的是,Emulate IE9 模式会考虑指令

<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE9">

Emulate IE8 模式告诉 IE 使用指令来决定如果渲染文档。标准模式下以 IE8 渲染,怪癖模式下以 IE5 渲染。和 IE8 模式不同的是,Emulate IE8 模式会考虑指令

<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE8">

Emulate IE7 模式告诉 IE 使用指令来决定如果渲染文档。标准模式下以 IE7 渲染,怪癖模式下以 IE5 渲染。和 IE7 模式不同的是,Emulate IE7 模式会考虑指令。对于大多数站点而言,这是首选的兼容模式

<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7">

IE5 模式告诉 IE7 是否以怪癖模式渲染文档

<meta http-equiv="X-UA-Compatible" content="IE=5">

Edge 模式告诉 IE 以最高级模式渲染文档,也就是任何 IE 版本都以当前版本所支持的最高级标准模式渲染,避免版本升级造成的影响。简单的说,就是什么版本 IE 就用什么版本的标准模式渲染

<meta http-equiv="X-UA-Compatible" content="IE=edge">

使用以下代码强制 IE 使用 Chrome Frame 渲染

<meta http-equiv="X-UA-Compatible" content="chrome=1">

提示 IE 用户安装 Google Frame
Google 官方提供了对 Google Frame 插件安装情况的检测,这里直接调用方法即可,如果检测到 IE 并未安装 Google Frame,则弹出对话框提示安装。

<script src="http://ajax.googleapis.com/ajax/libs/chrome-frame/1/CFInstall.min.js"></script><script>CFInstall.check();</script>

最佳的兼容模式方案,结合考虑以上两种:

<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
时间: 2024-11-05 22:51:18

谈 X-UA-Compatible 兼容模式的相关文章

再谈 X-UA-Compatible 兼容模式

如何理解 IE 的文档兼容模式(X-UA-Compatible)? IE 浏览器支持多种文档兼容模式,得以因此改变页面的渲染效果. IE9 模式支持全范围的既定行业标准,包括 HTML5(草案), W3C CSS Level 3 规范(草案), SVG 1.0 规范等 <meta http-equiv="X-UA-Compatible" content="IE=9"> IE8 模式支持许多既定行业标准,W3C CSS Level 2.1 规范和 W3C

浏览器兼容模式(转)

三种模式 首先我们要知道,为什么会有这么多模式.其实这是个历史遗留问题,在浏览器大战时期,网景浏览器(Netscape Navigator)和微软的IE浏览器(Microsoft Internet Explorer)对网页分别有不同的实现方式,那个时候的网页要针对这两种浏览器分别开发不同的版本.而到了W3C制定标准之后,这些浏览器就不能继续使用这种页面了,因而会导致大部分现有站点都不能使用.基于这个原因,浏览器才引入两种模式来处理一些遗留的站点. 现在的浏览器排版引擎支持三种模式:怪异(Quir

用Meta标签代码让360双核浏览器默认极速模式不是兼容模式

这篇文章主要介绍了用Meta标签代码让360双核浏览器默认极速模式打开网站不是兼容模式,需要的朋友可以参考下 这篇文章主要介绍了用Meta标签代码让360双核浏览器默认极速模式打开网站不是兼容模式,需要的朋友可以参考下. 一个网站,大量采用了html5和css3,希望用户都以webkit内核打开页面,但是测试却发现360的以ie内核打开为推荐模式,不知原因为何.其实360给网站开发者设计了一种选择的方法,只要加入一段Meta标签代码就可以解决. 以下信息摘自360官方网站: 浏览模式 极速模式.

WCF技术剖析之五:利用ASP.NET兼容模式创建支持会话(Session)的WCF服务

原文:WCF技术剖析之五:利用ASP.NET兼容模式创建支持会话(Session)的WCF服务 在<基于IIS的WCF服务寄宿(Hosting)实现揭秘>中,我们谈到在采用基于IIS(或者说基于ASP.NET)的WCF服务寄宿中,具有两种截然不同的运行模式:ASP.NET并行(Side by Side)模式和ASP.NET兼容模式.对于前者,WCF通过HttpModule实现了服务的寄宿,而对于后者,WCF的服务寄宿通过一个HttpHandler实现.只有在ASP.NET兼容模式下,我们熟悉的

【实战问题】【10】IE浏览器兼容问题,发布后变成了(浏览器IE9兼容模式,文档IE7标准模式)

起因: 近期发生一件特别无语的事,我写的程序在本地运行的时候在IE浏览器打开是IE9标准模式,发布到服务器之后再在IE浏览器打开,就变成了兼容模式,一步步改好之后在图片上传那里又卡了好久,最后都改好了之后,发现了问题所在,我的问题可能不适用于所有情况,仅给大家参考一下 我的问题很简单:我用了lanternFQ,关了就好了 过程: 1,所有和ajax这种格式的一样的,最后一项(此处为success)都不要加逗号(,). $.ajax({ type : "POST", url : &quo

meta 标签代码解决IE兼容问题,IE6,IE7,IE8,IE9,IE10(包括360的兼容模式)

最近做了一个项目,客户反映,在360下布局错位,远程调试了一下,发现客户使用的是360的兼容模式,然而我在自己的电脑上测试的时候是正常的(兼容模式也正常):简单研究了一下360的兼容模式,在360的兼容模式下按F12得到下图的调试信息: 经过测试,发现是红框处的设置的ie版本太低导致的,主要是文档模式更改文档模式为相对较高的版本即可解决, 这里,我添加了如下代码 <meta http-equiv="X-UA-Compatible" content="IE=edge,ch

黄聪:如何用代码设置控制自己网站的网页在360浏览器打开时强制优先使用极速模式,而非兼容模式

最近用360浏览器访问自己的网站,发现都是被优先选用兼容模式打开,这使得网站很难看.为了让360浏览器打开网站的时候优先试用极速模式,找了一下官方论坛,发现了解决方案. 在head标签中添加一行代码: <html> <head> <meta name="renderer" content="webkit|ie-comp|ie-stand"> </head> <body> </body> <

Angularjs在360兼容模式下取数据缓存问题解决办法

测试提了一个bug,在360浏览器兼容模式下,删除页面数据需要手动刷新浏览器才能看到最新的数据.首先要复现当时的问题,很容易就复现了,但是发现在360浏览器兼容模式下无法打开开发者工具.好在经过反复重装之后,终于打开了开发者工具,经过跟踪发现,第一次删除数据时可以正常刷新,第二次或以后的删除将无法刷新,跟踪代码,发现通过异步请求的数据正常的返回并且绑定了.点击搜索按钮,也无法实现刷新,但是点击分页,发现可以翻页.初步推断是浏览器缓存了异步请求数据,跟踪比较返回的数据发现,推断是正确的.于是从网上

强制浏览器使用兼容模式,Web.config,httpProtocol

对于一些政府类的网站,很多支持IE6~8,而不支持使用更高版本浏览器浏览.虽然有些浏览器会自动使用兼容模式,或有些人会手动调整浏览器的兼容模式,但不是每一个人.每一款浏览器都可以做到用兼容模式.所以,强制浏览器使用指定版本的兼容模式运行,变得势在必行. <configuration> <system.webServer> <!-- 设定网站服务器以指定预设兼容性模式 Lionden --> <httpProtocol> <customHeaders&g