国产浏览器大多是双内核,甚至是三内核。 
一个Chromium内核,也就是Chrome使用的内核,切换到这个内核的模式一般叫极速模式; 
一个IE内核,称之为IE模式; 
有的甚至还有一个修改过的IE内核,称之为兼容模式

这些浏览器这样做的原因是国内还有大量为IE浏览器量身定做的网站,为了兼容这些网站,不默认启用极速模式,而是根据代码判断选择IE模式或者兼容模式或者极速模式。

问题在于,浏览器自动选择经常判断错误,导致本来使用Webkit可以获得更好浏览效果的网站错误在IE模式中带着BUG运行。真是让开发者头疼。

幸好,现在多核浏览器已经支持通过meta标签指定浏览模式,那么,我们就可以通过meta代码强制浏览器启用Chromium内核,为用户提供最好的使用体验。

在代码编辑器中打开网站头部模板文件,即 标签所在文件。如 WordPress 的主题头部模板文件是主题目录下的 header.php 文件。

因为浏览器内核决定了HTML/CSS/JS代码的运行环境,所以我们需要把规定内核的代码添加在所有代码前面。

在头部开始标签下(是后面,不是后面)添加如下代码:

<meta name="renderer" content="webkit"/>
<meta name="force-rendering" content="webkit"/>
<meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1"/>

如上所述,在 标签后添加规定浏览器内核的meta代码即可完成强制浏览器在Webkit内核环境下打开网站,为用户提供Chrome几乎一样的访问效果。

你可以会奇怪,为什么有三行代码?是的,没错,就是三行。这三行代码分别作用于不同环境,如下所述:

强制Chromium内核,作用于360浏览器、QQ浏览器等国产双核浏览器:

<meta name="renderer" content="webkit"/>

强制Chromium内核,作用于其他双核浏览器:

<meta name="force-rendering" content="webkit"/>

如果有安装 Google Chrome Frame 插件则强制为Chromium内核,否则强制本机支持的最高版本IE内核,作用于IE浏览器:

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

添加好强制Webkit内核的代码,使用国产浏览器访问网站已经不存在IE兼容问题了,IE访客量将大大减少。但仍然不可避免会有一些老旧电脑通过低版本IE浏览器访问,如果我们专门为了这极小部分用户进行 CSS HACK ,将严重加重我们的工作量。

更何况自2016年1月起微软已经停止为IE11以下版本提供支持和更新,已经这么久没有更新,低版本IE不仅对CSS3和HTML5支持有问题,更有安全问题。

那么,我们不去支持低版本IE,这小部分用户怎么办呢?

我们可以使用 if IE 语句给网站添加IE升级提示,提示用户进行浏览器升级,或者切换更先进的浏览器再访问。

我们可以在刚刚的meta标签下添加一段跳转到IE升级提示页的代码(当IE版本低于IE11时跳转),实现低版本IE用户访问时提示他们进行升级或者更换浏览器。

强制Webkit内核和提示低版本IE访问用户升级完整代码如下所示,把这段代码添加到头部模板文件 标签下即可:

<meta name="renderer" content="webkit"/>
<meta name="force-rendering" content="webkit"/>
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"/>
<script>/*@cc_on window.location.href="http://support.dmeng.net/upgrade-your-browser.html?referrer="+encodeURIComponent(window.location.href); @*/</script>

@cc_on, 支持ie11以前浏览器解释,即ie11以前跳转到ie升级页 
(@cc_on 是 IE10 及更旧版IE特有的条件编译语句,因此可以用来判断是否除 IE11 以外的其他IE版本。) 
因为低版本IE访问时因为不兼容CSS3和HTML5网站往往是错版的,添加了上面这段代码,当低版本IE用户访问时就会跳转到升级提示页,避免不必要的资源加载,降低网站服务器开销。

// ie8以下自动跳转升级浏览器
<script>/*@cc_on var temp = window.navigator.userAgent.toUpperCase();var charHead = temp.indexOf('MSIE');var charLast = temp.indexOf(";", charHead);var ieVersion = temp.substring(charHead, charLast);ieVersion = ieVersion.split(' ')[1];if (ieVersion <= 8) {window.location.href="http://support.dmeng.net/upgrade-your-browser.html?referrer="+encodeURIComponent(window.location.href);} @*/</script>

当浏览器是ie11以前版本的,跳转到ie升级页相关推荐

  1. pageoffice在Edge浏览器、谷歌浏览器42及以上版本和火狐浏览器52及以上版本兼容处理

    Edge浏览器.谷歌浏览器42及以上版本和火狐浏览器52及以上版本做了比较大的升级,内容是禁止了所有的插件. 不光是pageoffice其他的插件也用不了,如果想在这样浏览器上打开pageoffice ...

  2. 自动判断浏览器的中英文版本自动跳转网站中英文页面代码

    许多网站现在都是依靠自动判断浏览器的中英文版本来判断给你打开网站的中文还是英文版,也许好多朋友还不知道这个代码,今天正好给公司改版企业网站用到了,在此公布出来,供大家一起学习. HTML网页根据来访者 ...

  3. 如何判断当前浏览器是IE11

    判断是否IE浏览器用的是window.navigator.userAgent,跟踪这个信息,发现在开发环境,识别为IE10,但访问服务器则识别为IE11,但IE11的userAgent里是没有MSIE ...

  4. 火狐浏览器与驱动对应版本,自动化测试浏览器驱动下载

    火狐浏览器与驱动对应版本,自动化测试浏览器驱动下载 Firefox(火狐浏览器)官方驱动:https://github.com/mozilla/geckodriver/releases/ 官方发布的浏 ...

  5. 在2012年10月31号这一天,2345浏览器的V2.2版本,大跳着出来了!

    系列文章目录 第十章:在2012年10月31号这一天,2345浏览器的V2.2版本,大跳着出来了! 文章目录 系列文章目录 前言 2012-10-31 V2.2版 新增功能 新增改进 BUG修复 总结 ...

  6. 2012年05月29号这一天,2345浏览器的V1.5版本,是进行改进还是丝毫未变!

    系列文章目录 第七章:2012年05月29号这一天,2345浏览器的V1.5版本,是进行改进还是丝毫未变! 文章目录 系列文章目录 前言 2012-05-29 V1.5版 新增功能 新增改进 BUG修 ...

  7. 浏览器兼容性--IE11以及Edge等下载文件的中文名出现乱码,前后端解决方案

    浏览器兼容性--IE11以及Edge等下载文件的中文名出现乱码,前后端解决方案 参考文章: (1)浏览器兼容性--IE11以及Edge等下载文件的中文名出现乱码,前后端解决方案 (2)https:// ...

  8. 浏览器的内核及版本的判断

    通过jquery 判断浏览器的内核及版本号<script type="text/javascript">$(function () {if ($.browser.msi ...

  9. uc浏览器TV版最新版本功能简介

    uc浏览器TV版最新版本功能简介 UC浏览器TV版怎么样?提起UC很多人都知道,不就是那款在手机上很火的浏览器么?而要说到UC电视版,知道的人就不多了.本月初,UC发布了旗下首款PC版浏览器,网友们试 ...

  10. 简易方法判断浏览器的类型和版本

    如何判断浏览器的类型和版本? -- 使用JavaScript的内置对象 navigator 的属性userAgent的值来判断(navigator.userAgent). navigator是java ...

最新文章

  1. 然后Denton et al, 2015 搞出了非常NB的改进版本
  2. OpenCV SFM模块安装
  3. 有python基础学java_Python基础学习篇
  4. 5G(5)---7个方面读懂5G标准
  5. 为什么let在php中报错,ES6系列之声明变量let与const
  6. 抓住六个点,谈唯品会的峰值系统应对实践
  7. 都说比特币无价值,涨得不合理;但你知道比特币最大的用途吗?
  8. sprintboot 发布
  9. 自动填充固定行数的 GridView (转)
  10. unity播放视频代码
  11. 5款自动爬取数据的神器!
  12. scala 打印乘法口诀表
  13. Mysql基础篇(5)—— 约束
  14. c#构造函数 例子学习
  15. Spring Boot -- JPA
  16. 前端轮播插件banner
  17. Rate limit bypas
  18. 【转】很好的英文自我介绍
  19. CSUOJ 1726 你经历过绝望吗?两次!(BFS + 优先队列)
  20. cesium 入门学习之一:运行cesium,展示3D地球

热门文章

  1. 推荐系统(6):推荐算法之基于内容的推荐算法
  2. 移植STM32F103VE程序到STM32F207VE系列应用注意事项
  3. MATLAB 常用语法、函数
  4. 论文阅读:基于Himawari-8 数据的日间海雾检测方法
  5. 如何减少linux内存碎片
  6. 在html中生成动态表格数据,JavaScript实现网页动态生成表格
  7. 谷歌Chrome浏览器不再支持Flash Player的完全解决方案
  8. 海康 Isecure VMS 客户端二次开发简单记录
  9. 项目文档说明前端部分怎么写?写进readme.md文件里面。
  10. 计算机网络arp表作用,arp映射表是什么?有什么作用