如何理解 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">

参考资料:

Make IE awesome by turning it into Google Chrome

Defining Document Compatibility

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

  1. 再谈MV*(MVVM MVP MVC)模式的设计原理—封装与解耦

    精炼并增补于:界面之下:还原真实的MV*模式 图形界面的应用程序提供给用户可视化的操作界面,这个界面提供给数据和信息.用户输入行为(键盘,鼠标等)会执行一些应用逻辑,应用逻辑(application ...

  2. Java并发编程-再谈 AbstractQueuedSynchronizer 1 :独占模式

    关于AbstractQueuedSynchronizer JDK1.5之后引入了并发包java.util.concurrent,大大提高了Java程序的并发性能.关于java.util.concurr ...

  3. 再谈IE的浏览器模式和文档模式

    原文:再谈IE的浏览器模式和文档模式 以前在 “IE8兼容视图(IE7 mode)与独立IE7的区别”一文中曾经涉及过浏览器模式和文档模式,但二者的区别却不甚了了,现在有了新的认识,再补充一下. 1. ...

  4. IE 兼容模式 设置 Meta Compatible 和 Iframe 子页面的关系

    背景 因为历史原因,之前很多的系统都会是 顶级页面+Iframe来加载子级页面的这种模式构件系统,而且系统都只能运行在IE6或者IE 高版本兼容模式下(IE 7模式). 随着现在的审美原来越高,脚本能 ...

  5. 再谈IE的浏览器模式和文档模式[转]

    http://www.cnblogs.com/liuzhendong/archive/2012/04/27/2474363.html 以前在 “IE8兼容视图(IE7 mode)与独立IE7的区别”一 ...

  6. GoF设计模式三作者15年后再谈模式

    Erich Gamma, Richard Helm, 和 Ralph Johnson在GoF设计模式发表15年以后,再谈模式,另外一位作者,也是四色原型的发明者Peter已经过世. 提问者:如今有85 ...

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

    原文:WCF技术剖析之五:利用ASP.NET兼容模式创建支持会话(Session)的WCF服务 在<基于IIS的WCF服务寄宿(Hosting)实现揭秘>中,我们谈到在采用基于IIS(或者 ...

  8. 再谈HTTP2性能提升之背后原理—HTTP2历史解剖

    即使千辛万苦,还是把网站升级到http2了,遇坑如<phpcms v9站http升级到https加http2遇到到坑>. 因为理论相比于 HTTP 1.x ,在同时兼容 HTTP/1.1 ...

  9. 从网卡发送数据再谈TCP/IP协议—网络传输速度计算-网卡构造

    在<在深谈TCP/IP三步握手&四步挥手原理及衍生问题—长文解剖IP>里面提到 单个TCP包每次打包1448字节的数据进行发送(以太网Ethernet最大的数据帧是1518字节,以 ...

随机推荐

  1. echarts在IE8下遮挡其他组件的问题

    echarts的图在IE8下会浮在上层遮挡住其他组件,解决方式是页面中引入 <meta http-equiv="X-UA-Compatible" content=" ...

  2. 嵌入式Linux驱动学习之路(二)u-boot体验

    u-boot工程简介 现在的u-boot支持PowerPC.ARM.X86.MIPS体系结构的上百种开发板,已经称为功能最多.灵活性最强,并且开发最积极的开源Bootloader.目前由DENX的Wo ...

  3. How to update FVDI Commander driver to latest V2015.6.2

    As FVDI Commander products are upgraded to new versions, I often receive emails from customers askin ...

  4. 使用SQLyog远程访问mysql数据库设置

    mysql数据库远程访问设置方法 1.修改localhost更改 "mysql" 数据库里的 "user" 表里的 "host" 项,从&q ...

  5. UVA 1474 Evacuation Plan

    题意:有一条公路,上面有n个施工队,要躲进m个避难所中,每个避难所中至少有一个施工队,躲进避难所的花费为施工队与避难所的坐标差的绝对值,求最小花费及策略. 解法:将施工队和避难所按坐标排序,可以看出有 ...

  6. ps存jpeg,格式保存的时候为什么选择“基线”

    jpeg是印前和网页设计常用的格式,最大好处就是能很大程度上压缩图像大小. 在ps中将图片保存为jpeg格式的时候会出现以下选项: 其中:图像选项都很熟悉,是关于图像质量的:而格式选项的用途主要是针对 ...

  7. Windows Azure应用系列:微软的云部署VPN

    本文介绍如何使用OpenVPN微软云计算server既定VPN维修. 过程,如下面: 1.新建Linux或者Ubuntu虚拟机.并设置port.(本文将建立Ubuntu作为演示) 2.利用PuTTY登 ...

  8. 布局fixed和sticky

    sticky非常非常非常好用怎么用看代码: 这里为什么没有设置高度呢,因为这个高度应该是浏览器高度,浏览器高度在时刻变化怎么办? js处理: 此JS里面会有执行方法一步一步看 这个里面有JS方法 这个 ...

  9. Python RabbitMQ 权重设置

    消费端recv设置   注:设置消费端处理完一条消息后再发另一条   channel.basic_qos(prefetch_count=1)   由于每一条机器的处理速度不同,所以我们这里就会对应,机 ...

  10. docker系统学习之docker界面管理

    docker可视化界面 dockerUI已废弃,转投Portainer项目 Portainer,轻量级管理界面,基本满足中小单位需求 官方Github https://github.com/porta ...