X-UA-Compatible是神马?

X-UA-Compatible是IE8的一个专有<meta>属性,它告诉IE8采用何种IE版本去渲染网页,在html的<head>标签中使用。可以在微软官方文档获取更多介绍。

为什么要用X-UA-Compatible?

在IE8刚推出的时候,很多网页由于重构的问题,无法适应较高级的浏览器,所以使用X-UA-Compatible标签强制IE8采用低版本方式渲染。

使用下面这段代码后,开发者无需考虑网页是否兼容IE8浏览器,只要确保网页在IE6、IE7下的表现就可以了。

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

时至今日,IE6已被微软判了死刑,我们在重构时应首先考虑更完善的IE8下的体验,然后依次回退兼容IE7和6。令我担忧的情况是当IE9正式发布时如果IE6在国内还没被淘汰,那么将出现前端工程师需要面临4个IE版本的疯狂局面(且4个版本显示差异较明显)。

给网站添加X-UA-Compatible标签

我建议使用下面的X-UA-Compatible标签:

<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />

IE=edge告诉IE使用最新的引擎渲染网页,chrome=1则可以激活Chrome Frame[1]。

网页中添加方法

在<head>下面添加上述代码即可。WordPress则在主题header.php文件里做修改。

这样的方法简单快捷,但是弊端是代码将无法通过W3C验证。其实这并不是问题,毕竟标准只是标准,如果只有这一个“错误”完全不会有任何不良的影响。

当然你可能像Sivan一样有代码洁癖和一定程度的标准癖,那么我们还可以从服务器端进行这个设置,请继续往下看。

Apache服务器设置方法

嗯⋯⋯我们可以在Apache主机做一些设置让服务器告诉IE采用何种引擎来渲染。在网站作用目录找到或新建.htaccess文件,添加下面的内容保存即可。

<IfModule mod_setenvif.c><IfModule mod_headers.c>BrowserMatch MSIE ieHeader set X-UA-Compatible "IE=Edge" env=ieBrowserMatch chromeframe gcfHeader append X-UA-Compatible "chrome=1" env=gcf</IfModule>
</IfModule>

Nginx服务器设置方法

现在很多朋友使用Nginx作为搭建环境,当然也是OK的。找到\nginx\conf\nginx.conf并编辑,在server { }区域里(最好是闭合符前面起一行)添加下列代码即可

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

不清楚具体位置的请参考paul irish的配置文件。

好啦,上面就是3种常用的添加方法。我认为这个标签主要是为重构者服务,如果代码的兼容性很强那么不用也罢。

Chrome Frame[1]:Chrome Frame可以让旧版IE浏览器使用Chrome的WebKit渲染引擎处理网页,因此旧版IE用户可以体验到包括HTML5在内的众多现代网页技术

from:http://lightcss.com/add-x-ua-compatible-meta-to-your-website/

转载于:https://www.cnblogs.com/xuan52rock/p/6737673.html

【转】给网站添加X-UA-Compatible标签相关推荐

  1. 怎样给自己的网站添加一个在浏览器标签、地址栏左边和收藏夹上显示的缩略logo标志

    问题描述 不知道,大家有没有注意,有的网站,地址栏上都有一个小图标,如csdn或者是百度. 但是我个人做的网站就没有,怎样添加这样的图标呢? 其实,这个是通过favicon.ico来控制的. favi ...

  2. php源码中如何添加滚动公告,如何给WordPress网站添加滚动公告?

    如何给WordPress网站添加滚动公告?今天我们一起了解一下. 1.添加公告文章类型 首先,注册一个公告的文章类型,包括公告的新建,添加,编辑与删除.在functions.php的同级目录下新建一个 ...

  3. chromebook刷机_如何将网站添加到您的Chromebook架子上

    chromebook刷机 Bookmarks are great to keep your favorite sites nearby, but they aren't the fastest opt ...

  4. 使用prismjs为网站添加代码高亮功能

    prismjs 是一款轻量.可扩展的代码语法高亮库,使用现代化的 Web 标准构建,使用 Prismjs 可以快速为网站添加代码高亮功能,支持超过113中编程语言,还支持多种插件,是简洁.高效的代码高 ...

  5. live2d 3行代码 为网站添加萌萌哒看板娘

    3行代码 为网站添加萌萌哒看板娘 看板娘是一种职业和习惯称呼,也是ACGN次文化中的萌属性之一.简而言之就是小店的女服务生,也有"吸引顾客,招揽生意,提高人气"等作用类似品牌形象代 ...

  6. 如何为你的网站添加标志性的图标(头像)呢?

    今天get到一个新的知识点,虽说不是什么复杂的东西,但是能实现效果还是蛮高兴的. 为网站添加标识性的的图标(头像)?也许有人像我一样,刚开始并不知道啥意思,但是看到别人网站都有标识性的头像,立马就明白 ...

  7. 如何给网站添加 OG 协议

    示例参考: <meta property="og:site_name" content="Colby Fayock" /> <metaprop ...

  8. 如何给自己的网站添加 gitalk 评论系统

    如何给自己的网站添加 gitalk 评论系统 自己写评论系统会比较复杂,需要管理用户信息等.不如直接使用 github 的用户信息. gitalk 就是实现这种评论的插件. https://githu ...

  9. 自建站的博客网站添加百度统计功能统计流量

    有了自己的网站后,想要知道自己网站的访问情况怎么办,有两种方法,一种是自己写代码进行ip地址获取并解析IP地址来源从而得到IP地址属地,进一步进行统计.另一种方法就是使用现有的统计工具,我这里使用的是 ...

最新文章

  1. .net知识和学习方法系列(十五)类型,对象,堆栈和托管堆
  2. ActionBarActionMode的理解,出现菜单栏
  3. P2082 区间覆盖(加强版)
  4. Identity Server 4 - Hybrid Flow - Claims
  5. neo4j python 算法_图论与图学习(二):图算法
  6. oracle vm发现无效设置_Oracle数据库编译失效对象相关命令总结大全,值得收藏
  7. 关于AD域账户和组的管理技巧
  8. 三月数据库技术通讯.pdf | Oracle配置DCD避免会话被防火墙强制断开
  9. 让元素固定_原神雷元素不如火元素吗?阵容搭配与圣遗物强化攻略
  10. PAT 1090 危险品装箱(25 分)- 乙级
  11. python画柱状图-python plotly画柱状图代码实例
  12. 排序总结---常用的排序算法总结,java和js实现
  13. CentOS7 完全卸载MySQL
  14. XP母盘制作详细教程(完全版)(转)
  15. ASP.NET中EnableViewState
  16. button渐变色 ios_ios文字设置渐变色
  17. 20+案例教你可视化图表的设计方法
  18. CCS7.2中如何切换烧写RAM和Flash版本程序
  19. 影响你选择职业的,跟个人相关的主要的因素
  20. windows虚机设定永久静态路由

热门文章

  1. python turtle绕原点旋转_「加德老师与小朋友们的编程之旅」Python海龟作图(上)
  2. python可以用来写导航吗_在python中使用selenium进行导航
  3. 用R语言绘制动态地图,代码奉上!(REmap包详解)
  4. 文字识别(三)--文字定位与切割
  5. linux函数删除某文件,Linux环境下用C++删除指定文件
  6. git学习指南_GIT 学习指南
  7. 计算机存储系统中,有哪些措施可以提高 CPU 访问存储系统的速度?
  8. 粉碎文件软件测试大乐,软件测试基础(面试)(27页)-原创力文档
  9. ROS下载Gazebo模型到本地
  10. Presto 日期和时间函数