网页在360浏览器上出现显示异常,费了好大劲才解决,特此记录
网页写完,发布后,被告知360浏览器显示出大片空白区域.我之前用chrome 跟ie浏览器都测试过,没有问题,但是偏偏在国产浏览器上出了问题,而且问题很大.
下载了360浏览器查看了一下,发现网页尺寸竟然有两千多px,右边有一大片空白,我的屏幕都只有1920x1080px,chrome跟ie下都是显示正常的,真不知道360是怎么搞得.
* 上网查了下关于360兼容的问题,原来360集成了ie内核跟chrome内核,我看了下网页是在chrome内核下渲染的,页面字体被缩放了,所以空出了一大片.
而且本地调试的时候显示正常,到了发布后往往会显示不正常,让人百思不得其解
- 猜测应该是本地调试的时候用的是ie内核渲染,到了发布后又用chrome内核渲染.
解决方法是在head标签中添加一行代码告诉360浏览器用哪种内核渲染:
若页面需默认用极速核,增加标签:
<meta name="renderer" content="webkit">
若页面需默认用ie兼容内核,增加标签:
<meta name="renderer" content="ie-comp">
若页面需默认用ie标准内核,增加标签:
<meta name="renderer" content="ie-stand">
试了试3种标签,chrome内核会缩小网页,ie兼容内核直接卡死,查了下貌似兼容内核用的是ie7的内核,很垃圾,最后使用ie标准内核显示正常.但是明明使用的是ie标准内核,浏览器的样式,调试工具还是chrome的,真是让人无语.