IE 兼容模式

兼容模式的由来

早期的浏览器, IE 独大。这也就导致其很多东西和w3c 的标准有很多不一样的地方。譬如他有自己才看的懂得自定义Tag。

一个熟悉的名词--浏览器大战, 形象的刻画了这期间发生的事情。

IE 的占用量逐步下降, firefox 和chrome异军突起, 要不是捆绑在windows 系统, 真不知道IE 是否早就消亡了。原因很简单, IE的速度等各方面表现都不是很好。

微软逐渐意识到自己搞自己的是不行的, 在IE 后续的版本中就逐渐的向标准靠拢了。

这样的话, 问题就来了。新版的IE逐渐接近标准, 而旧版和标准差异又很大, 新版和旧版直接如何兼容呢?

总不能说, IE 发布了一个新版, 原先开发的网页都无法使用了。为了解决这个问题,微软在IE8以后加入了所谓的兼容性模式,也就是能够在旧的网站使用兼容性模式浏览,而一切正常,而到比较新的网站就用正常模式浏览。

特别注意的是, 兼容模式是从IE8 才开始有的。也是因为IE8跟IE7有不少不同。

如何定义兼容模式

首先说一下<!DOCTYPE> 声明的作用

经常看到的声明类似:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

DTD -文档类型定义.

这是个浏览器引擎使用的,dtd 里面定义的是哪些标签是这个页面可以使用的正确的标签以及这些标签的结构是怎样的。

不过html 不符合这个标准,可能无法显示。

如果没有指定有效的doctype声明,大多数浏览器都会使用一个内建的默认DTD。在这种情况下,浏览器会用内建的DTD来试着显示你所指定的标记。对于一些临时性的、匆忙拼凑的文档(这种文档有许多),你确实可以考虑省略doctype声明,并接受浏览器的默认显示。

对于兼容模式,微软的给我们的解决方案是设置X-UA-Compatible。

X-UA-compatible 标头不区分大小写;不过,它必须显示在网页中除 title 元素和其他 meta 元素以外的所有其他元素之前的标头(HEAD 节(可能为英文网页))中。

语法也很简单,在html中加入

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

以上的作用是:

无论是否用DTD声明文档标准,IE8/9都会以IE7引擎来渲染页面。

content 除了设置成IE=7, 还可以设置成:

1. content="edge"
Windows以最高版本的IE显示内容。

2. content="IE=EmulateIE7"

根据 <!DOCTYPE> 指令确定如何呈现内容。标准模式指令以Windows Internet Explorer 7 标准模式显示,而 Quirks 模式指令以 IE5 模式显示。与 IE7 模式不同,EmulateIE7 模式遵循 <!DOCTYPE> 指令。对于多数网站来说,它是首选的兼容性模式。

定义多种文档模式时,使用逗号(,)

<meta http-equiv="X-UA-Compatible" content="IE=7,IE=9" />
/*或者是*/
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7,IE=EmulateIE9" />

或者

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

参考

1. http://msdn.microsoft.com/en-us/library/jj676915%28v=vs.85%29.aspx

2. http://msdn.microsoft.com/en-us/library/cc288325%28v=vs.85%29.aspx

原文地址:https://www.cnblogs.com/pangblog/p/3301787.html