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

本文讲的是如何让页面在 360 浏览器里按预期渲染:只需在 head 中加入 meta renderer 指令…


生猛大蝦 - festive composition mothers day with gift box flowers

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

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

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 支持都不一样。极速核更偏现代标准,兼容核更照顾旧站点,标准核则介于两者之间。排错时要先确认页面目标内核,再看样式和脚本兼容。


发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

这个站点使用 Akismet 来减少垃圾评论。了解你的评论数据如何被处理。