码迷,mamicode.com
首页 > 其他好文 > 详细

兼容利器之X-UA-Compatible

时间:2016-01-20 13:18:34      阅读:145      评论:0      收藏:0      [点我收藏+]

标签:

文档兼容模式

不同浏览器之间经常产生各种奇异的现象,为了解决这些问题,使用以下方法,发现很多问题自动消失不见了

<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
这是一个,文档兼容模式的定义。 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">

Google Chrome Frame

Google开发的一个Google Chrome Frame「Google Chrome 浏览器内嵌框架 – GCF」。使用GCF可以让用户的IE浏览器外观不变,但用户在浏览网页时实际上使用的是Chrome的内核,并且支持Windows XP及以上系统的IE6/7/8。

 

官方对其定义:

 

  • 可使用开放式网络技术(如 HTML5 canvas 标记)立即启动,甚至包括 Internet Explorer 6、7 或 8 尚不支持的技术。
  • 利用 JavaScript 性能增强功能,使应用程序速度更快,响应更灵敏。

w3.org的html5验证

然而,下一个问题又来了,在w3.org的html5验证工具下:

 HTML5 Validator Error “Bad value X-UA-Compatible for attribute http-equiv on element meta

技术分享

介个也好解决,针对三种主流服务器,我们都可以在服务器端配置http equiv规则:

1、apache服务器

确保 mod_headers 和 mod_setenvif 是available的,然后在httpd.conf「新版Apache的配置文件是 apache2.conf」或者在.htaccess中加入以下规则:

1.<IfModule mod_setenvif.c>
2.<IfModule mod_headers.c>
3.BrowserMatch chromeframe gcf
4.Header append X-UA-Compatible "chrome=1" env=gcf
5.</IfModule>
6.</IfModule>

2、Windows Server在IIS7或者更高版本的服务器

只需要修改web.config文件,添加如下信息即可:

01.<configuration>
02.<system.webServer>
03.<httpProtocol>
04.<customHeaders>
05.<add name = "X-UA-Compatible" value = "chrome=1" />
06.</customHeaders>
07.</httpProtocol>
08.</system.webServer>
09.</configuration>

3、Nginx服务器

只需要找到ginx.conf并编辑,在server { }区域里(最好是闭合符前面起一行)添加下列代码即可:

1.add_header "X-UA-Compatible" "IE=Edge, chrome=1";

总结

  1. 如果支持Google Chrome Frame:GCF,则使用GCF渲染;
  2. 如果系统安装ie8或以上版本,则使用最高版本ie渲染;
  3. 否则,这个设定可以忽略。

 

 

极速模式

最近用360浏览器访问自己的网站,发现都是被优先选用兼容模式打开,这使得网站很难看。为了让360浏览器打开网站的时候优先试用极速模式,找了一下官方论坛,发现了解决方案。

在head标签中添加一行代码:

 <meta name="renderer" content="webkit|ie-comp|ie-stand">

content的取值为webkit,ie-comp,ie-stand之一,区分大小写,分别代表用webkit内核,IE兼容内核,IE标准内核。 

若页面需默认用极速核,增加标签:<meta name="renderer" content="webkit"> 

若页面需默认用ie兼容内核,增加标签:<meta name="renderer" content="ie-comp"> 

若页面需默认用ie标准内核,增加标签:<meta name="renderer" content="ie-stand"> 

 

原文地址:http://se.360.cn/v6/help/meta.html

 

 


参考文章:

http://ziren.org/html-css/content-ie-edge-chrome-1-introduction-web-page-using-chrome-rendering.html

http://www.cnblogs.com/huangcong/p/3870276.html

兼容利器之X-UA-Compatible

标签:

原文地址:http://www.cnblogs.com/xcsn/p/5144690.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!