# 你们这是啥前端, 怎么我的360浏览器都没法看? 一段代码解决用360浏览器的傻逼用户

- Link: https://yjyj.net/learn/4698.html
- Published: 2014-08-06T14:28:16+08:00
- Author: 小 虾

⚡ 生猛大蝦编辑部 · 30 秒核心看点

 * 在 head 里加一行 meta renderer，就能指定 360 浏览器的渲染内核。
 * 可选 webkit、ie-comp、ie-stand 三种值，分别对应不同兼容模式。
 * 遇到页面显示异常时，先确认内核选择，再排查 HTML5 与 ActiveX 兼容差异。

最近加班有点多,废话就不多说了.
 详细请见: http://se.360.cn/v6/help/meta.html

_简单来说就是:_
 在head标签中添加一行代码：

    ```decode:true
    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">
    ```

各渲染内核的技术细节
 内核 Webkit IE兼容 IE标准 文档模式 Chrome 21 IE6/7 IE9/IE10/
IE11(取决于用户的IE) HTML5支持 YES NO YES ActiveX控件支持 NO YES YES 各内核UA示例
http://p6.qhimg.com/d/360browser/20131016/UAshili.png

📌 生猛大蝦编辑部 · 背景与实操延伸

这篇文章的核心不是“修浏览器”，而是用一行 meta 把页面渲染规则说清楚。对老项目尤其
重要：同一套 HTML/CSS/JS，在不同内核下可能出现布局、脚本和控件差异。实操时建议先
确认页面是否需要兼容旧 IE 行为，再决定默认极速核还是兼容核；如果涉及表单、插件或
旧脚本，更要做多内核回归测试，避免只在自己电脑上正常。

❓ 延伸问答与排错指南（FAQ）

360浏览器页面显示异常怎么处理？

优先在 head 中加入 meta renderer，明确指定 webkit、ie-comp 或 ie-stand 之一。这样
能让浏览器按预期内核渲染页面，避免因默认模式不同导致的布局错乱、脚本异常或兼容问题。

webkit、ie-comp、ie-stand分别是什么意思？

webkit 表示用极速核；ie-comp 表示用 IE 兼容内核；ie-stand 表示用 IE 标准内核。三者
区分大小写，选择哪一种取决于页面对 HTML5、ActiveX 和旧版 IE 行为的兼容需求。

为什么同一页面在不同内核下表现不一样？

因为不同渲染内核的文档模式、HTML5 支持和 ActiveX 支持都不一样。极速核更偏现代标准，
兼容核更照顾旧站点，标准核则介于两者之间。排错时要先确认页面目标内核，再看样式和
脚本兼容。

📚 【[招数学习](https://yjyj.net/category/learn)】专栏延伸阅读与热门精选（[全站文章归档](https://yjyj.net/archive)）：

 * [密码保护：记录一下,编译mangosone时出现的小问题](https://yjyj.net/learn/4695.html)
 * [再撸wordpress后台菜单](https://yjyj.net/learn/wordpress-learn/4684.html)
 * [准备把军哥的lnmp给换掉](https://yjyj.net/learn/centos/4717.html)
 * [优化一下php.ini](https://yjyj.net/learn/centos/4719.html)
 * 热门必读[CSS 盒模型边界重叠 (Margin Collapse) 原理与解决方案](https://yjyj.net/css/3536.html)
 * 热门必读[css布局实例](https://yjyj.net/learn/3901.html)
